在服务端(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 1.0.4 - New Wave Javascript(js源文件)
Jan 15 Javascript
用Div仿showModalDialog模式菜单的效果的代码
Mar 05 Javascript
js获取GridView中行数据的两种方法 分享
Jul 13 Javascript
JavaScript中的函数的两种定义方式和函数变量赋值
May 12 Javascript
用html5 js实现点击一个按钮达到浏览器全屏效果
May 28 Javascript
jquery列表拖动排列(由项目提取相当好用)
Jun 17 Javascript
jQuery中detach()方法用法实例
Dec 25 Javascript
JS表格组件神器bootstrap table详解(基础版)
Dec 08 Javascript
基于javascript实现彩票随机数生成(简单版)
Apr 17 Javascript
使用proxy实现一个更优雅的vue【推荐】
Jun 19 Javascript
Vue中img的src是动态渲染时不显示的解决
Nov 14 Javascript
js操作两个json数组合并、去重,以及删除某一项元素
Sep 22 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实现把MySQL数据库导出为.sql文件实例(仿PHPMyadmin导出功能)
2014/05/10 PHP
Joomla数据库操作之JFactory::getDBO用法
2016/05/05 PHP
php实现快速对二维数组某一列进行组装的方法小结
2019/12/04 PHP
PHP pthreads v3下的Volatile简介与使用方法示例
2020/02/21 PHP
js实现的真正的iframe高度自适应(兼容IE,FF,Opera)
2010/03/07 Javascript
jQuery.autocomplete 支持中文输入(firefox)修正方法
2011/03/10 Javascript
js中通过split函数分割字符串成数组小例子
2013/09/21 Javascript
jQuery中ready事件用法实例
2015/01/19 Javascript
js实现延迟加载的方法
2015/06/24 Javascript
jQuery实现简单下拉导航效果
2015/09/07 Javascript
需灵活掌握的Bootstrap预定义排版类 你精通吗?
2016/06/20 Javascript
jQuery内容筛选选择器实例代码
2017/02/06 Javascript
node.js入门学习之url模块
2017/02/25 Javascript
微信小程序下拉框功能的实例代码
2018/11/06 Javascript
详解Vue用cmd创建项目
2019/02/12 Javascript
微信小程序人脸识别功能代码实例
2019/05/07 Javascript
layui 表单标签的校验方法
2019/09/04 Javascript
JS组件库AlloyTouch实现图片轮播过程解析
2020/05/29 Javascript
vue+element_ui上传文件,并传递额外参数操作
2020/12/05 Vue.js
简化Python的Django框架代码的一些示例
2015/04/20 Python
python执行get提交的方法
2015/04/29 Python
使用Python横向合并excel文件的实例
2018/12/11 Python
python函数map()和partial()的知识点总结
2020/05/26 Python
python判断all函数输出结果是否为true的方法
2020/12/03 Python
利用HTML5的新特点实现图片文件异步上传
2014/05/29 HTML / CSS
CheapTickets泰国:廉价航班,查看促销价格并预订机票
2019/12/28 全球购物
澳大利亚在线划船、露营和钓鱼商店:BCF Australia
2020/03/22 全球购物
数据库面试要点基本概念
2013/10/31 面试题
UNIX文件类型
2013/08/29 面试题
影视艺术学院毕业生自荐信
2013/11/13 职场文书
应届大学生求职信
2013/12/01 职场文书
创业计划书如何吸引他人眼球
2014/01/10 职场文书
关于旅游的活动方案
2014/08/15 职场文书
团员个人年度总结
2015/02/26 职场文书
MySql子查询IN的执行和优化的实现
2021/08/02 MySQL
Python 类,对象,数据分类,函数参数传递详解
2021/09/25 Python