当前位置: 首页 > news >正文

一个事件激活多个JavaScript函数

  如果你的网页中一个“OnLoad”事件要激活两个以上的JavaScript函数,那怎么办呢?

 

      请看下面一个例子:

  < BODY OnLoad='alert("这是标签调用的函数")'>

  < script language="JavaScript">

  function myfunction(){

  alert("这是JS脚本调用的函数");

  }

  document.body.οnlοad=myfunction;

  < /script>

  < /BODY>

  运行后你会发现,它只跳出一个“这是JS脚本调用的函数”的警告框。< BODY>标签中要求激活的函数被“忽略”了。当然你可以运用前面提过的方法,把两个函数放一个函数里激活。但这样有不少弊端,特别是如果把这段 JavaScript代码写成一个"myjs.js"文件,要用它的话直接加上< script language="JavaScript" src="myjs.js">< /script>即可,但如果还要在引用文件的页面中根据情况修改标签或者添加一段代码,多麻烦呀。这就降低了代码的适用性了。

  可不可以在编写JavaScript代码时就设计好,如果前面OnLoad事件已经有函数要激活,让它仍然激活前面的函数,但同时也激活本段代码所需要的函数?答案是肯定的。我们先看下这段代码:

  < BODY OnLoad='alert("这是< BODY>标签调用的函数")'>

  < script language="JavaScript">

  // document.body.onload是函数(function)型,用toString()函数转为字符串(string)型:

  alert(document.body.onload.toString());

  < /script>

  < /BODY>

  运行后其中一个警告框中提示:

  function anonymous()

  {

  alert("这是标签调用的函数")

  }

  发现什么了吗?“document.body.onload.toString()”就是上面这段函数代码!我们这段字符串作为代码的一部分运行,那么我们就多了一个函数“anonymous()”,于是将这个函数和我们现在需要激活的函数一起激活就行了!

  下面我们以第一次提到的代码为例进行修改,得到最终代码:

  < BODY OnLoad='alert("这是标签调用的函数")'>

  < script language="JavaScript">

  function myfunction(){

  alert("这是JS脚本调用的函数");

  }

  //现在我们要激活的函数是“myfunction()”,原来要激活的函数是标签里的“alert()”,

  //下面这段代码可以两个一起激活:

  myActive="myfunction()";

  if(document.body.onload.toString())

  {

  eval(document.body.onload.toString().replace('anonymous()','bodyload()'));

  document.body.οnlοad=new Function("bodyload();"+myActive);

  }

  else document.body.οnlοad=new Function(myActive);

  < /script>

  < /BODY>

  上段代码中,变量myActive是JS代码中要激活的函数,eval(string)函数是把其字符串参数当作是JavaScript脚本来运行。我们把 document.body.onload.toString()中的“anonymous()”替换为“bodyload()”,得到一个新函数 “bodyload()”,它包含了所有原来要激活的函数,再把函数“bodyload()”和我们要激活的函数一起在OnLoad事件中激活。

  为什么要把“anonymous()”替换为“bodyload()”呢?因为这个方法适用于所有事件(例如OnMouseOver),而所有事件 toString()都是得到“anonymous()”,为了不和其它事件也用了这个方法冲突,我们把它替换掉。在其它事件中也依此替换即可。

  好了,我们运行一下最终代码,如你所愿地两个函数都激活了吧?添加的代码也挺简单,有挺强的适用性。

相关文章:

  • [.net]官方水晶报表的使用以演示下载
  • FotoVision学习手记(2)
  • 重回文明社会!!
  • 硬盘盒、笔记本硬盘选购全攻略
  • 3D -- GIVE ME FIVE
  • ADO.NET 2.0 - 如何使用 DataView 来排序数据
  • 2005:走向成熟的计算机图书出版
  • 解决windows 2003 sp1下安装arcsde 9.0 for sql server 2000 sp4概要方案
  • 《SharePoint Portal Server 2003 深入指南》开放了两个章节在线阅读
  • Asp.Net生成验证码(转)--------Good!
  • Visual C# 2005 - 如何利用程序代码产生多层次绘图效果
  • 关于mysql数据库中数据输入问题
  • 转载:写给计算机专业的朋友们
  • 一个用js写的导航(转)
  • 给msn 添加addin, 制作msn机器人
  • 【附node操作实例】redis简明入门系列—字符串类型
  • Fastjson的基本使用方法大全
  • iOS 系统授权开发
  • iOS动画编程-View动画[ 1 ] 基础View动画
  • Laravel Telescope:优雅的应用调试工具
  • PHP 程序员也能做的 Java 开发 30分钟使用 netty 轻松打造一个高性能 websocket 服务...
  • React-Native - 收藏集 - 掘金
  • Vim Clutch | 面向脚踏板编程……
  • 翻译--Thinking in React
  • 少走弯路,给Java 1~5 年程序员的建议
  • Nginx实现动静分离
  • #每日一题合集#牛客JZ23-JZ33
  • $jQuery 重写Alert样式方法
  • (2.2w字)前端单元测试之Jest详解篇
  • (poj1.2.1)1970(筛选法模拟)
  • (安全基本功)磁盘MBR,分区表,活动分区,引导扇区。。。详解与区别
  • (附源码)ssm跨平台教学系统 毕业设计 280843
  • (入门自用)--C++--抽象类--多态原理--虚表--1020
  • (十一)图像的罗伯特梯度锐化
  • (一)Thymeleaf用法——Thymeleaf简介
  • (原)记一次CentOS7 磁盘空间大小异常的解决过程
  • (原创) cocos2dx使用Curl连接网络(客户端)
  • (转)用.Net的File控件上传文件的解决方案
  • .bashrc在哪里,alias妙用
  • .net core 实现redis分片_基于 Redis 的分布式任务调度框架 earth-frost
  • .NET Core日志内容详解,详解不同日志级别的区别和有关日志记录的实用工具和第三方库详解与示例
  • .NET Core中Emit的使用
  • .NET 表达式计算:Expression Evaluator
  • .net 程序 换成 java,NET程序员如何转行为J2EE之java基础上(9)
  • .net 桌面开发 运行一阵子就自动关闭_聊城旋转门家用价格大约是多少,全自动旋转门,期待合作...
  • .NET上SQLite的连接
  • .net图片验证码生成、点击刷新及验证输入是否正确
  • @column注解_MyBatis注解开发 -MyBatis(15)
  • @Resource和@Autowired的区别
  • [<死锁专题>]
  • [3D基础]理解计算机3D图形学中的坐标系变换
  • [Angular 基础] - 自定义指令,深入学习 directive
  • [C#] 如何调用Python脚本程序
  • [docker] Docker容器服务更新与发现之consul
  • [exgcd] Jzoj P1158 荒岛野人