在服务端(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 相关文章推荐
JS烟花背景效果实现方法
Mar 03 Javascript
解决js图片加载时出现404的问题
Nov 30 Javascript
javascript事件的传播基础实例讲解(35)
Feb 14 Javascript
jQuery.Ajax()的data参数类型详解
Jul 23 jQuery
vue中$set的使用(结合在实际应用中遇到的坑)
Jul 10 Javascript
javascript中关于类型判断的一些疑惑小结
Oct 14 Javascript
详解vantUI框架在vue项目中的应用踩坑
Dec 06 Javascript
ios中视频的最后一桢问题解决
May 14 Javascript
js new Date()实例测试
Oct 31 Javascript
微信小程序实现带放大效果的轮播图
May 26 Javascript
vue+swiper实现左右滑动的测试题功能
Oct 30 Javascript
关于JS中的作用域中的问题思考分享
Apr 06 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
PHP获取搜索引擎关键字来源的函数(支持百度和谷歌等搜索引擎)
2012/10/03 PHP
[原创]后缀就扩展名为js的文件是什么文件
2007/12/06 Javascript
从零开始学习jQuery (十) jQueryUI常用功能实战
2011/02/23 Javascript
JS动态获取当前时间,并写到特定的区域
2013/05/03 Javascript
javascript表单验证大全
2015/08/12 Javascript
jquery带翻页动画的电子杂志代码分享
2015/08/21 Javascript
BootStrap selectpicker
2016/06/20 Javascript
JS实现根据文件字节数返回文件大小的方法
2016/08/02 Javascript
利用JS提交表单的几种方法和验证(必看篇)
2016/09/17 Javascript
jQuery实现图片滑动效果
2017/03/08 Javascript
Bootstrap Multiselect 常用组件实现代码
2017/07/09 Javascript
微信小程序开发之路由切换页面重定向问题
2018/09/18 Javascript
Node.js操作MongoDB数据库实例分析
2020/01/19 Javascript
vue2路由方式--嵌套路由实现方法分析
2020/03/06 Javascript
JavaScript 双向链表操作实例分析【创建、增加、查找、删除等】
2020/04/28 Javascript
JS this关键字在ajax中使用出现问题解决方案
2020/07/17 Javascript
使用python解析xml成对应的html示例分享
2014/04/02 Python
Python标准库之多进程(multiprocessing包)介绍
2014/11/25 Python
Python中的元类编程入门指引
2015/04/15 Python
python中的错误处理
2016/04/10 Python
python 实现学生信息管理系统的示例
2020/11/28 Python
美国最顶级的精品店之一:Hampden Clothing
2016/12/22 全球购物
悬挂训练绳:TRX
2017/12/14 全球购物
英国和世界各地鲜花速递专家:Arena Flowers
2018/02/10 全球购物
日本热销NO.1胶原蛋白冻:Aishitoto爱希特多
2019/06/20 全球购物
德国最大的婴儿用品网上商店:Kidsroom.de(支持中文)
2020/09/02 全球购物
写好求职应聘自荐信的三部曲
2013/09/21 职场文书
养殖人员的创业计划书范文
2013/12/26 职场文书
工伤事故赔偿协议书
2014/04/15 职场文书
公司建议书怎么写
2014/05/15 职场文书
学生安全承诺书
2014/05/22 职场文书
公司应聘自荐书
2014/06/14 职场文书
法人代表证明书
2014/09/18 职场文书
个人年终总结范文
2015/03/09 职场文书
800字作文之大雪
2019/12/04 职场文书
Python下opencv库的安装过程及问题汇总
2021/06/11 Python