在服务端(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刷新站IP和PV
Sep 05 Javascript
需要做特殊处理的DOM元素属性的访问
Nov 05 Javascript
node.js中的fs.appendFileSync方法使用说明
Dec 17 Javascript
js判断是否按下了Shift键的方法
Jan 27 Javascript
JavaScript实现多栏目切换效果
Dec 12 Javascript
es6的数字处理的方法(5个)
Mar 16 Javascript
JS实现的随机排序功能算法示例
Jun 09 Javascript
基于es6三点运算符的使用方法(实例讲解)
Oct 12 Javascript
layui 选择列表,打勾,点击确定返回数据的例子
Sep 02 Javascript
JS实现点击下拉列表文本框中出现对应的网址,点击跳转按钮实现跳转
Nov 25 Javascript
Vue 微信端扫描二维码苹果端却只能保存图片问题(解决方法)
Jan 19 Javascript
一篇文章带你搞懂Vue虚拟Dom与diff算法
Aug 25 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+Html+缓存
2006/11/25 PHP
微信公众平台DEMO(PHP)
2016/05/04 PHP
php 删除指定文件夹的实例讲解
2017/07/25 PHP
PHP大文件分割上传 PHP分片上传
2017/08/28 PHP
Windows下wamp php单元测试工具PHPUnit安装及生成日志文件配置方法
2018/05/28 PHP
PHP filesize函数用法浅析
2019/02/15 PHP
jQuery中removeAttr()方法用法实例
2015/01/05 Javascript
利用JS生成博文目录及CSS定制博客
2016/02/10 Javascript
原生js验证简洁注册登录页面
2016/12/17 Javascript
Javascript中常用类型的格式化方法小结
2016/12/26 Javascript
JavaScript实现经典排序算法之选择排序
2016/12/28 Javascript
源码分析Vue.js的监听实现教程
2017/04/23 Javascript
分享19个JavaScript 有用的简写写法
2017/07/07 Javascript
React Native 通告消息竖向轮播组件的封装
2020/08/25 Javascript
vue-infinite-loading2.0 中文文档详解
2018/04/08 Javascript
javaScript产生随机数的用法小结
2018/04/21 Javascript
vue使用jsonp抓取qq音乐数据的方法
2018/06/21 Javascript
AngularJs返回前一页面时刷新一次前面页面的方法
2018/10/09 Javascript
在移动端使用vue-router和keep-alive的方法示例
2018/12/02 Javascript
vue响应式系统之observe、watcher、dep的源码解析
2019/04/09 Javascript
浅谈JS的原型和继承
2019/05/08 Javascript
使用vue实现各类弹出框组件
2019/07/03 Javascript
[00:35]DOTA2上海特级锦标赛 MVP.Phx战队宣传片
2016/03/04 DOTA
浅谈Python中的闭包
2015/07/08 Python
恢复百度云盘本地误删的文件脚本(简单方法)
2017/10/21 Python
利用python如何处理百万条数据(适用java新手)
2018/06/06 Python
Django forms组件的使用教程
2018/10/08 Python
python3爬虫获取html内容及各属性值的方法
2018/12/17 Python
python实现桌面托盘气泡提示
2019/07/29 Python
Python实现打印实心和空心菱形
2019/11/23 Python
Python解析多帧dicom数据详解
2020/01/13 Python
美国学校校服,儿童和婴儿服装:Cookie’s Kids
2016/10/14 全球购物
美国战术品牌:5.11 Tactical
2019/05/01 全球购物
家长给孩子的表扬信
2014/01/17 职场文书
女方离婚起诉书
2015/05/18 职场文书
入党积极分子培养联系人意见
2015/08/12 职场文书