在服务端(Page.Write)调用自定义的JS方法详解


Posted in Javascript onAugust 09, 2013

首先,我们应该可以先明确,为什么我们用Page.Write把自定义的JS方法输出到页面上为什么IE不能识别,会出现“XXX未定义”的错误。原因很简单,因为我们用Page.Write输出的脚本是出现在页面的最顶端。IE读到是javascript函数的时候,就开始执行,但是此时我们link的js文件并未被IE读入,所以IE无法识别我们定义在js文件里面的方法。那write alert为什么可以呢?因为alert是IE内嵌的脚本功能函数,不管有没有页面,IE都认得它。
找到问题所在,自然就好解决了:
1、把我们自定义的方法内嵌到IE里面。 ---> 看起来有点异想天开,呵呵
2、等页面载入完成后再触发事件。 --->触发事件,没错。
如何知道页面是否载入完成呢?
1、通过document的状态
2、通过事件触发(windows.onload)
第一种好像比较不保险,有时候明明已经全部载完了,它还是一直显示在传送数据(FF此情况最明显),所以还是用事件比较保险一点。
定义一个简单方法,挂载到windows.onload里面,执行的时候做一个标识

var loadComplete = false;
function LoadCompleted()
{
loadComplete= true;
}
window.attachEvent("onload",LoadCompleted);

呵呵,这样我们只要通过判断loadComplete来取得页面是否载入完毕了。
var mImgdir = "";
var mCaption = "caption";
var mMsg = "Message";
var mOkClick= null;
function ShowMessage(imgdir,caption,msg,OkClick)
{
if(loadComplete)
{
KMessageBox.ShowInfo(mImgdir,mCaption,mMsg,mOkClick);
}
}

这样子在loadComplete未false的情况下,我们就不会去执行KMessageBox.ShowInfo()方法,只然就不会出现JS错误提示了。
单单这样子,还不行,因为输出的这样的脚本,IE只在输出页面的时候执行了一次,但是此时loadComplete=false,所以,我们需要定时检测页面是否载入完毕。说到定时,只然是祭出setTimeout & setInterval. 我们这里需要不停的检测,故使用setInterval方法。最终代码如下:
var loadComplete = false;
var mImgdir = "";
var mCaption = "caption";
var mMsg = "Message";
var mOkClick= null;
var timerID;
function ShowMessage(imgdir,caption,msg,OkClick)
{
if(loadComplete)
{
KMessageBox.ShowInfo(mImgdir,mCaption,mMsg,mOkClick);
     //卸载此事件     window.detachEvent("onload",function(){LoadCompleted;});     //停止定时触发
     window.clearInterval(timerID); 
    } 
}
function LoadCompleted() { loadComplete=true; }
window.attachEvent("onload",LoadCompleted);
//设置定时检测机制
timerID = window.setInterval(ShowMessage,1);

当然以上代码只兼容IE,因为使用attachEvent 和 detachEvent,至于让他兼容其他浏览器可以参看[JavaScript]自定义Title的显示方式一文中的处理方式:
if(!document.attachEvent)//Not IE
{
document.attachEvent = function(){document.addEventListener(arguments[0].substr(2),arguments[1],arguments[2])}
}
if(!window.attachEvent)//Not IE
{
window.attachEvent = function(){window.addEventListener(arguments[0].substr(2),arguments[1],arguments[2])}
}
 

在服务端,只要StringBuilder出以上的脚本,然后Write出来就可以了。上面也只是提供了一种思路,当然还会有其他的办法,比如我不适用定时检测,我直接挂载到windows.onload里面,让页面自动监听,自动执行,也未尝不可:),正所谓条条大路通罗马嘛~~~~~
以上思路来自yui,并且yui实现了一个更漂亮的自定义MessageBox,有兴趣的朋友可以共同研究下。
Javascript 相关文章推荐
jquery tools系列 expose 学习
Sep 06 Javascript
jquery实现居中弹出层代码
Aug 25 Javascript
Javascript全局变量var与不var的区别深入解析
Dec 09 Javascript
用jquery修复在iframe下的页面锚点失效问题
Aug 22 Javascript
javascript数组遍历for与for in区别详解
Dec 04 Javascript
jQuery中removeProp()方法用法实例
Jan 05 Javascript
创建你的第一个AngularJS应用的方法
Jun 16 Javascript
详解Js模板引擎(TrimPath)
Nov 22 Javascript
自定义require函数让浏览器按需加载Js文件
Nov 24 Javascript
vue将时间戳转换成自定义时间格式的方法
Mar 02 Javascript
微信小程序ibeacon三点定位详解
Oct 31 Javascript
如何为你的JS项目添加智能提示与类型检查详解
Mar 12 Javascript
Jquery显示、隐藏元素以及添加删除样式
Aug 09 #Javascript
jquery实现文字由下到上循环滚动的实例代码
Aug 09 #Javascript
jquery 实现上下滚动效果示例代码
Aug 09 #Javascript
15条JavaScript最佳实践小结
Aug 09 #Javascript
web网页按比例显示图片实现原理及js代码
Aug 09 #Javascript
html向js方法传递参数具体实现
Aug 08 #Javascript
js获取控件位置以及不同浏览器中的差别介绍
Aug 08 #Javascript
You might like
Laravel5框架添加自定义辅助函数的方法
2018/08/01 PHP
js每次Title显示不同的名言
2008/09/25 Javascript
JavaScript 程序编码规范
2010/11/23 Javascript
js判断变量是否未定义的代码
2020/03/28 Javascript
jquery 面包屑导航 具体实现
2013/06/05 Javascript
Jquery利用mouseenter和mouseleave实现鼠标经过弹出层且可以点击
2014/02/12 Javascript
javascript操作excel生成报表示例
2014/05/08 Javascript
JavaScript实现上下浮动的窗口效果代码
2015/10/12 Javascript
学习JavaScript设计模式(策略模式)
2015/11/26 Javascript
浅谈jQuery中ajaxPrefilter的应用
2016/08/01 Javascript
AngularJS基础 ng-model 指令详解及示例代码
2016/08/02 Javascript
微信小程序 教程之注册程序
2016/10/17 Javascript
jQuery实现遮罩层登录对话框
2016/12/29 Javascript
js 性能优化之算法和流程控制
2017/02/15 Javascript
React Native如何消除启动时白屏的方法
2017/08/08 Javascript
详解Immutable及 React 中实践
2018/03/01 Javascript
JS实现将二维数组转为json格式字符串操作示例
2018/07/12 Javascript
Vue resource三种请求格式和万能测试地址
2018/09/26 Javascript
JS实现扫码枪扫描二维码功能
2020/01/03 Javascript
python中定义结构体的方法
2013/03/04 Python
Python使用Flask框架获取当前查询参数的方法
2015/03/21 Python
Python2.x中文乱码问题解决方法
2015/06/02 Python
Flask框架中密码的加盐哈希加密和验证功能的用法详解
2016/06/07 Python
python安装oracle扩展及数据库连接方法
2017/02/21 Python
Python实现快速计算词频功能示例
2018/06/25 Python
python如何读取bin文件并下发串口
2019/07/05 Python
Python pymsql模块的使用
2020/09/07 Python
Molly Bracken法国电子商店:法国女性时尚品牌
2019/07/24 全球购物
编辑找工作求职信范文
2013/12/16 职场文书
《彩色世界》教学反思
2014/04/12 职场文书
陈胜吴广起义口号
2014/06/20 职场文书
中文专业自荐书
2014/06/29 职场文书
2015年上半年党建工作总结
2015/03/30 职场文书
酒店前台接待岗位职责
2015/04/02 职场文书
在酒桌上的敬酒词
2015/08/12 职场文书
python的变量和简单数字类型详解
2021/09/15 Python