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升级新版本后选择器的语法问题
Jun 02 Javascript
Jquery 的outerHeight方法使用介绍
Sep 11 Javascript
jquery操作 iframe的方法
Dec 03 Javascript
JavaScript基本语法讲解
Jun 03 Javascript
JS实现黑色风格的网页TAB选项卡效果代码
Oct 09 Javascript
js如何准确获取当前页面url网址信息
Sep 13 Javascript
用jQuery获取table中行id和td值的实现代码
May 19 Javascript
jquery mobile界面数据刷新的实现方法
May 28 Javascript
jQuery自制提示框tooltip改进版
Aug 01 Javascript
Ajax基础知识详解
Feb 17 Javascript
JavaScript展开操作符(Spread operator)详解
Jul 20 Javascript
JS操作字符串转数字的常见方法示例
Oct 29 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
如何选购合适的收音机
2021/03/01 无线电
攻克CakePHP系列一 连接MySQL数据库
2008/10/22 PHP
php输入流php://input使用浅析
2014/09/02 PHP
PHP获取客户端及服务器端IP的封装类
2016/07/21 PHP
IE与Firefox在JavaScript上的7个不同写法小结
2009/09/14 Javascript
jquery 插件学习(五)
2012/08/06 Javascript
开发插件的两个方法jquery.fn.extend与jquery.extend
2013/11/21 Javascript
node.js中的buffer.Buffer.isEncoding方法使用说明
2014/12/14 Javascript
Javascript实现快速排序(Quicksort)的算法详解
2015/09/06 Javascript
JavaScript原生xmlHttp与jquery的ajax方法json数据格式实例
2015/12/04 Javascript
深入理解requestAnimationFrame的动画循环
2016/09/20 Javascript
简单实现js点击展开二级菜单功能
2017/05/16 Javascript
web前端页面生成exe可执行文件的方法
2018/02/08 Javascript
JavaScript常见事件处理程序实例总结
2019/01/05 Javascript
微信小程序中如何计算距离某个节日还有多少天
2019/07/15 Javascript
详解JavaScript 作用域
2020/07/14 Javascript
vue 实现setInterval 创建和销毁实例
2020/07/21 Javascript
深入讲解Java编程中类的生命周期
2016/02/05 Python
讲解Python的Scrapy爬虫框架使用代理进行采集的方法
2016/02/18 Python
教你用Type Hint提高Python程序开发效率
2016/08/08 Python
Django中STATIC_ROOT和STATIC_URL及STATICFILES_DIRS浅析
2018/05/08 Python
Python使用re模块正则提取字符串中括号内的内容示例
2018/06/01 Python
Python列表生成式与生成器操作示例
2018/08/01 Python
python定义类self用法实例解析
2020/01/22 Python
用HTML5制作数字时钟的教程
2015/05/11 HTML / CSS
全球速卖通巴西站点:Aliexpress巴西
2016/08/24 全球购物
加拿大女包品牌:Matt & Nat
2017/05/12 全球购物
加拿大品牌鞋包连锁店:Little Burgundy
2021/02/28 全球购物
路政管理专业个人自荐信范文
2013/11/30 职场文书
毕业生自荐书
2013/12/18 职场文书
广告设计专业毕业生自我鉴定
2014/09/27 职场文书
2014年会计个人工作总结
2014/11/24 职场文书
合同范本之电脑出租
2019/08/13 职场文书
爱国之歌(8首)
2019/09/29 职场文书
python解决12306登录验证码的实现
2021/04/18 Python
Anaconda配置各版本Pytorch的实现
2021/08/07 Python