js修改onclick动作的四种方法(推荐)


Posted in Javascript onAugust 18, 2016

第一种:button.onclick = Function("alert('hello');");

第二种:button.onclick = function(){alert("hello"); };

第三种:button.onclick = myAlert;

              function myAlert(){
                     alert("hello");
              }

第四种:

这种情况更加动态,更为实用,而且还能添加多个函数(添加的事件的顺序即执行顺序),呵呵

if(window.addEventListener){ // Mozilla, Netscape, Firefox
    //element.addEventListener(type,listener,useCapture); 
    button.addEventListener('click', alert('11'), false);
    button.addEventListener('click', alert('12'), false);//执行顺序11 -> 12
  } else { // IE
    button.attachEvent('onclick', function(){alert('21');});
    button.attachEvent('onclick', function(){alert('22');});执行顺序22 -> 21
  }

实例讲解:

button.onclick = Function ("alert('31');");
  button.onclick = Function ("alert('32');");
  button.onclick = Function ("alert('33');"); //如果这样写,那么将会只有最后一个方法被执行

  button.attachEvent("onclick", function(){alert('41');});
  button.attachEvent("onclick", function(){alert('42');});
  button.attachEvent("onclick", function(){alert('43');}); //如果这样写,三个方法都会被执行

  // 当然,你也可以这样写
  button.onclick = Function("alert('51');");
  button.attachEvent("onclick", function(){alert('52');});

   //对应移除事件
  detachEvent('onclick' ,func);//ie下使用删除事件func
  removeEventListener('click' ,func);//Mozilla下,删除事件func

以上这篇js修改onclick动作的四种方法(推荐)就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
Javascript-Mozilla和IE中的一个函数直接量的问题
Jan 09 Javascript
javascript基础知识大全 便于大家学习,也便于我自己查看
Aug 17 Javascript
对js关键字命名的疑问介绍
Apr 25 Javascript
JS实现双击编辑可修改状态的方法
Aug 14 Javascript
javascript高级选择器querySelector和querySelectorAll全面解析
Apr 07 Javascript
JavaScript+Java实现HTML页面转为PDF文件保存的方法
May 30 Javascript
基于JavaScript实现淘宝商品广告效果
Aug 10 Javascript
JS实现的简单表单验证功能示例
Oct 13 Javascript
JS开发自己的类库实例分析
Aug 28 Javascript
jquery实现点击弹出对话框
Feb 08 jQuery
Vue实现input宽度随文字长度自适应操作
Jul 29 Javascript
JavaScript交换变量常用4种方法解析
Sep 02 Javascript
AngularJS 整理一些优化的小技巧
Aug 18 #Javascript
BootStrap下拉框在firefox浏览器界面不友好的解决方案
Aug 18 #Javascript
js获取form表单所有数据的简单方法
Aug 18 #Javascript
Javascript中浏览器窗口的基本操作总结
Aug 18 #Javascript
浅谈jQuery中hide和fadeOut的区别 show和fadeIn的区别
Aug 18 #Javascript
Laydate时间组件在火狐浏览器下有多时间输入框时只能给第一个输入框赋值的解决方法
Aug 18 #Javascript
jQuery fadeOut 异步实例代码详解
Aug 18 #Javascript
You might like
咖啡冲泡指南 咖啡有哪些制作方式 单品咖啡 意式咖啡
2021/03/06 冲泡冲煮
真正的ZIP文件操作类(php)
2007/07/21 PHP
PHP FATAL ERROR: CALL TO UNDEFINED FUNCTION BCMUL()解决办法
2014/05/04 PHP
Laravel 4 初级教程之Pages、表单验证
2014/10/30 PHP
yii通过小物件生成view的方法
2016/10/08 PHP
表单(FORM)的一些实用效果代码
2007/03/25 Javascript
document.open() 与 document.write()的区别
2007/08/13 Javascript
使用jQuery实现dropdownlist的联动效果(sharepoint 2007)
2011/03/30 Javascript
js中reverse函数的用法详解
2013/12/26 Javascript
利用jQuery实现可以编辑的表格
2014/05/26 Javascript
JavaScript遍历table表格中的某行某列并打印其值
2014/07/08 Javascript
jquery 实现输入邮箱时自动补全下拉提示功能
2015/10/04 Javascript
js实现图片懒加载效果
2017/07/17 Javascript
微信小程序radio组件使用详解
2018/01/31 Javascript
JavaScript继承与多继承实例分析
2018/05/26 Javascript
laydate如何根据开始时间或者结束时间限制范围
2018/11/15 Javascript
微信小程序入门之广告条实现方法示例
2018/12/05 Javascript
解决layui table表单提示数据接口请求异常的问题
2019/09/24 Javascript
jQuery 查找元素操作实例小结
2019/10/02 jQuery
解决vue刷新页面以后丢失store的数据问题
2020/08/11 Javascript
使用python编写脚本获取手机当前应用apk的信息
2014/07/21 Python
通过Python使用saltstack生成服务器资产清单
2016/03/01 Python
浅谈python中的getattr函数 hasattr函数
2016/06/14 Python
提升Python效率之使用循环机制代替递归函数
2019/07/23 Python
python中字典按键或键值排序的实现代码
2019/08/27 Python
Python利用matplotlib绘制约数个数统计图示例
2019/11/26 Python
Python面向对象封装操作案例详解
2019/12/31 Python
宝拉珍选官方旗舰店:2%水杨酸精华液,收缩毛孔粗大和祛痘
2018/07/01 全球购物
中层干部竞争上岗演讲稿
2014/01/13 职场文书
纺织工程专业个人求职信范文
2014/01/27 职场文书
退伍老兵事迹材料
2014/01/31 职场文书
小学教师评语大全
2014/04/23 职场文书
党的群众路线教育实践活动个人自我剖析材料
2014/10/07 职场文书
2015年管理人员工作总结
2015/05/13 职场文书
商业计划书范文
2019/04/24 职场文书
pytorch 实现多个Dataloader同时训练
2021/05/29 Python