JS动态给对象添加事件的简单方法


Posted in Javascript onJuly 19, 2016

WEB项目中,我们常常会碰到要动态对相应的对象添加事件,如下,有id="txtPrice"的文本框控件:

<div>
  <input type="text" id="txtPrice" name = "txtPrice" value = "0"/>
 <div>

现在我们为其动态添加一事件,JS核心代码如下:

document.getElementById("txtPrice").attachEvent('onblur', function (){alert('添加事件成功!')});

【补充】

有时候为了实现不同浏览器之前的兼容,我们会这样写:

Code highlighting produced by Actipro CodeHighlighter (freeware)http://www.CodeHighlighter.com/-->1 if(window.attachEvent)
{
  document.getElementById("txtPrice").attachEvent('onblur', function (){alert('添加事件成功!')});      
}
else
{  
  document.getElementById("txtPrice").addEventListener('onblur', function (){alert('添加事件成功!')},false);
}

以上这篇JS动态给对象添加事件的简单方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
基于jquery的气泡提示效果
May 31 Javascript
Javascript中的回调函数和匿名函数的回调示例介绍
May 12 Javascript
Jquery遍历Json数据的方法
Apr 20 Javascript
简述JavaScript中正则表达式的使用方法
Jun 15 Javascript
Vue声明式渲染详解
May 17 Javascript
JavaScript中的FileReader图片预览上传功能实现代码
Jul 24 Javascript
jQuery 1.9版本以上的浏览器判断方法代码分享
Aug 28 jQuery
jQuery中图片展示插件highslide.js的简单dom
Apr 22 jQuery
CSS3 动画卡顿性能优化的完美解决方案
Sep 20 Javascript
JS随机密码生成算法
Sep 23 Javascript
vue 使用原生组件上传图片的实例
Sep 08 Javascript
JavaScript实现下拉列表
Jan 20 Javascript
老生常谈js动态添加事件--- 事件委托
Jul 19 #Javascript
Bootstrap表单布局
Jul 19 #Javascript
一次$.getJSON不执行的简单记录
Jul 19 #Javascript
深入浅析javascript中的作用域(推荐)
Jul 19 #Javascript
javascript弹出带文字信息的提示框效果
Jul 19 #Javascript
总结在前端排序中遇到的问题
Jul 19 #Javascript
ECMAScript6快速入手攻略
Jul 18 #Javascript
You might like
DEDE采集大师官方留后门的删除办法
2011/01/08 PHP
php数组一对一替换实现代码
2012/08/31 PHP
PHP JSON格式的中文显示问题解决方法
2015/04/09 PHP
php 提交表单 关闭layer弹窗iframe的实例讲解
2018/08/20 PHP
jquery $.each 和for怎么跳出循环终止本次循环
2013/09/27 Javascript
第一次接触神奇的Bootstrap基础排版
2016/07/26 Javascript
微信小程序 条件渲染详解
2016/10/09 Javascript
vue实现可增删查改的成绩单
2016/10/27 Javascript
关于Vue.nextTick()的正确使用方法浅析
2017/08/25 Javascript
JS中的Replace()传入函数时的用法详解
2017/09/11 Javascript
Angular客户端请求Rest服务跨域问题的解决方法
2017/09/19 Javascript
Vue学习之axios的使用方法实例分析
2020/01/06 Javascript
如何利用Node.js与JSON搭建简单的动态服务器
2020/06/16 Javascript
Python学习笔记之os模块使用总结
2014/11/03 Python
python中如何使用朴素贝叶斯算法
2017/04/06 Python
python numpy函数中的linspace创建等差数列详解
2017/10/13 Python
Python实现矩阵转置的方法分析
2017/11/24 Python
Python 3.7新功能之dataclass装饰器详解
2018/04/21 Python
ActiveMQ:使用Python访问ActiveMQ的方法
2019/01/30 Python
python 解决print数组/矩阵无法完整输出的问题
2020/02/19 Python
Python线程threading模块用法详解
2020/02/26 Python
Keras load_model 导入错误的解决方式
2020/06/09 Python
Python with语句用法原理详解
2020/07/03 Python
Python3.9.1中使用match方法详解
2021/02/08 Python
Lacoste美国官网:经典POLO衫品牌
2016/10/12 全球购物
EGO Shoes美国/加拿大:英国时髦鞋类品牌
2018/08/04 全球购物
将时尚融入珠宝:Adornmonde
2019/10/17 全球购物
毕业自我鉴定范文
2013/11/06 职场文书
网络维护管理员的自我评价分享
2013/11/11 职场文书
七一党建活动方案
2014/01/28 职场文书
网上卖盒饭创业计划书范文
2014/02/07 职场文书
一年级数学下册复习计划
2015/01/17 职场文书
音乐教师个人总结
2015/02/06 职场文书
社区党支部承诺书
2015/04/29 职场文书
公安忠诚教育心得体会
2016/01/23 职场文书
MySQL数据库Innodb 引擎实现mvcc锁
2022/05/06 MySQL