在服务端(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 相关文章推荐
Javascript继承机制的设计思想分享
Aug 28 Javascript
jquery删除ID为sNews的tr元素的内容
Apr 10 Javascript
常见的jQuery选择器汇总
Nov 24 Javascript
js实现文字超出部分用省略号代替实例代码
Sep 01 Javascript
jQuey将序列化对象在前台显示地实现代码(方法总结)
Dec 13 Javascript
javascript 面向对象function详解及实例代码
Feb 28 Javascript
前端自动化开发之Node.js的环境搭建教程
Apr 01 Javascript
node版本管理工具n包使用教程详解
Nov 09 Javascript
基于vue实现移动端圆形旋钮插件效果
Nov 28 Javascript
原生js实现碰撞检测
Mar 12 Javascript
Vue触发input选取文件点击事件操作
Aug 07 Javascript
gojs实现蚂蚁线动画效果
Feb 18 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程序员工具
2008/05/26 PHP
php 正则 过滤html 的超链接
2009/06/02 PHP
phpexcel导出excel的颜色和网页中的颜色显示不一致
2012/12/11 PHP
PHP英文字母大小写转换函数小结
2014/05/03 PHP
Laravel学习教程之request validation的编写
2017/10/25 PHP
PHP ADODB实现分页功能简单示例
2018/05/25 PHP
PHP实现普通hash分布式算法简单示例
2018/08/06 PHP
HTTP状态代码以及定义(解释)
2007/02/02 Javascript
用Javascript实现锚点(Anchor)间平滑跳转
2009/09/08 Javascript
JavaScript编程开发中的五个实用小技巧
2010/07/22 Javascript
使用隐藏的new来创建对象
2011/03/29 Javascript
jquery实现相册一下滑动两次的方法
2015/02/09 Javascript
JS实现从顶部下拉显示的带动画QQ客服特效代码
2015/10/24 Javascript
jQuery插件之Tocify动态节点目录菜单生成器附源码下载
2016/01/08 Javascript
jQuery unbind()方法实例详解
2016/01/19 Javascript
原生js实现验证码功能
2017/03/16 Javascript
详解Nodejs之静态资源处理
2017/06/05 NodeJs
浅谈JS封闭函数、闭包、内置对象
2017/07/18 Javascript
JavaScript编写的网页小游戏,很给力
2017/08/18 Javascript
vue2和vue3的v-if与v-for优先级对比学习
2020/10/10 Javascript
Python的净值数据接口调用示例分享
2016/03/15 Python
python socket多线程通讯实例分析(聊天室)
2016/04/06 Python
python3 实现一行输入,空格隔开的示例
2018/11/14 Python
使用APScheduler3.0.1 实现定时任务的方法
2019/07/22 Python
Python PIL库图片灰化处理
2020/04/07 Python
css3类选择器之结合元素选择器和多类选择器用法
2017/03/09 HTML / CSS
斯凯奇新西兰官网:SKECHERS新西兰
2018/02/22 全球购物
现代家居用品及礼品:LBC Modern
2018/06/24 全球购物
女士时装鞋:Chinese Laundry
2018/08/29 全球购物
Nebula美国官网:便携式投影仪
2019/03/15 全球购物
销售工作岗位职责
2013/12/24 职场文书
小学毕业感言150字
2014/02/05 职场文书
高中课前三分钟演讲稿
2014/08/18 职场文书
浅谈 JavaScript 沙箱Sandbox
2021/11/02 Javascript
Python matplotlib多个子图绘制整合
2022/04/13 Python
Android 中的类文件和类加载器详情
2022/06/05 Java/Android