在服务端(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实现的一个导航滚动效果具体代码
May 27 Javascript
window.onload和$(function(){})的区别介绍
Oct 30 Javascript
整理Javascript事件响应学习笔记
Dec 02 Javascript
js+flash实现的5图变换效果广告代码(附演示与demo源码下载)
Apr 01 Javascript
vue2.0 中#$emit,$on的使用详解
Jun 07 Javascript
angularjs之$timeout指令详解
Jun 13 Javascript
微信小程序开发之IOS和Android兼容的问题
Sep 26 Javascript
AngularJS实现的base64编码与解码功能示例
May 17 Javascript
vue解决弹出蒙层滑动穿透问题的方法
Sep 22 Javascript
Bootstrap fileinput 上传新文件移除时触发服务器同步删除的配置
Oct 08 Javascript
微信小程序利用云函数获取手机号码
Dec 17 Javascript
js实现浏览器打印功能的示例代码
Jul 15 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
为了这两部电子管收音机,买了6套全新电子管和10粒刻度盘灯泡
2021/03/02 无线电
PHP常用开发函数解析之数组篇[未完结]
2012/07/30 PHP
使用xampp搭建运行php虚拟主机的详细步骤
2015/10/21 PHP
Yii2中使用join、joinwith多表关联查询
2016/06/30 PHP
php微信公众号开发之微信企业付款给个人
2018/10/04 PHP
laravel实现上传图片的两种方式小结
2019/10/12 PHP
PHP与Web页面交互操作实例分析
2020/06/02 PHP
用js遍历 table的脚本
2008/07/23 Javascript
获取3个数组不重复的值的具体实现
2013/12/30 Javascript
js动态控制table的tr、td增加及删除的具体实现
2014/04/30 Javascript
两个多选select(multiple左右)添加、删除选项和取值实例
2014/05/12 Javascript
浅析基于WEB前端页面的页面内容搜索的实现思路
2014/06/10 Javascript
input标签内容改变的触发事件介绍
2014/06/18 Javascript
uploadify多文件上传参数设置技巧
2015/11/16 Javascript
基于canvas实现的钟摆效果完整实例
2016/01/26 Javascript
javascript每日必学之条件分支
2016/02/17 Javascript
js仿QQ中对联系人向左滑动、滑出删除按钮的操作
2016/04/07 Javascript
JavaScript动态添加事件之事件委托
2016/07/12 Javascript
简单的js计算器实现
2016/10/26 Javascript
解决vue 路由变化页面数据不刷新的问题
2018/03/13 Javascript
JavaScript数组去重的方法总结【12种方法,号称史上最全】
2019/02/28 Javascript
详解babel升级到7.X采坑总结
2019/05/12 Javascript
[07:57]2018DOTA2国际邀请赛寻真——PSG.LGD凤凰浴火
2018/08/12 DOTA
Python DataFrame设置/更改列表字段/元素类型的方法
2018/06/09 Python
调试Django时打印SQL语句的日志代码实例
2019/09/12 Python
Scrapy中如何向Spider传入参数的方法实现
2020/09/28 Python
html5 自定义播放器核心代码
2013/12/20 HTML / CSS
Expedia爱尔兰:酒店、机票、租车及廉价假期
2017/01/02 全球购物
护理专业应届毕业生推荐信
2013/11/15 职场文书
中班开学寄语
2014/04/04 职场文书
关于工作时间玩手机的检讨书
2014/09/18 职场文书
员工教育培训协议书
2014/09/27 职场文书
2014年银行工作总结范文
2014/11/12 职场文书
公司安全管理制度范本
2015/08/05 职场文书
python图像处理基本操作总结(PIL库、Matplotlib及Numpy)
2021/06/08 Python
MySQL中存储时间的最佳实践指南
2021/07/01 MySQL