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实现回旋滚动效果
Jan 08 Javascript
js replace正则表达式应用案例讲解
Jan 17 Javascript
在页面中js获取光标/鼠标的坐标及光标的像素坐标
Nov 11 Javascript
IE6下javasc#ipt:void(0) 无效的解决方法
Dec 23 Javascript
js中利用tagname和id获取元素的方法
Jan 03 Javascript
使用jQuery判断浏览器滚动条位置的方法
May 30 Javascript
自定义require函数让浏览器按需加载Js文件
Nov 24 Javascript
Linux系统中利用node.js提取Word(doc/docx)及PDF文本的内容
Jun 17 Javascript
解决angularJS中input标签的ng-change事件无效问题
Sep 13 Javascript
koa2实现登录注册功能的示例代码
Dec 03 Javascript
JavaScript实现轮播图特效
Apr 10 Javascript
JavaScript变量Dom对象的所有属性
Apr 30 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
一漂亮的PHP图片验证码实例
2014/03/21 PHP
什么情况下可以不写PHP的闭合标签“?&gt;”
2014/08/28 PHP
常用的php图片处理类(水印、等比缩放、固定高宽)分享
2015/06/19 PHP
PHP格式化MYSQL返回float类型的方法
2016/03/30 PHP
JS的千分位算法实现思路
2013/07/31 Javascript
Javascript动态创建div的方法
2015/02/09 Javascript
JS获取网页图片name属性的方法
2015/04/01 Javascript
jQuery和CSS仿京东仿淘宝列表导航菜单
2017/01/04 Javascript
jQuery弹出层插件popShow(改进版)用法示例
2017/01/23 Javascript
AngularJS的脏检查深入分析
2017/04/22 Javascript
通过源码分析Vue的双向数据绑定详解
2017/09/24 Javascript
express如何解决ajax跨域访问session失效问题详解
2019/06/20 Javascript
vue element自定义表单验证请求后端接口验证
2019/12/11 Javascript
[46:25]DOTA2上海特级锦标赛主赛事日 - 4 败者组第五轮 MVP.Phx VS EG第二局
2016/03/05 DOTA
python 基础学习第二弹 类属性和实例属性
2012/08/27 Python
Python实现模拟登录及表单提交的方法
2015/07/25 Python
TensorFlow实现MLP多层感知机模型
2018/03/09 Python
python检测文件夹变化,并拷贝有更新的文件到对应目录的方法
2018/10/17 Python
python GUI库图形界面开发之PyQt5动态(可拖动控件大小)布局控件QSplitter详细使用方法与实例
2020/03/06 Python
PyCharm中Matplotlib绘图不能显示UI效果的问题解决
2020/03/12 Python
贝尔帐篷精品店:Bell Tent Boutique
2019/06/12 全球购物
材料工程专业毕业生求职信
2014/03/04 职场文书
《二泉映月》教学反思
2014/04/15 职场文书
竞选班干部演讲稿100字
2014/08/20 职场文书
学校党的群众路线教育实践活动对照检查材料
2014/09/24 职场文书
单位法人授权委托书范本
2014/10/09 职场文书
《蜜蜂引路》教学反思
2016/02/22 职场文书
高中英语教学反思范文
2016/03/02 职场文书
祝福语集锦:给妹妹结婚的祝福语
2019/12/18 职场文书
Pytorch 统计模型参数量的操作 param.numel()
2021/05/13 Python
浅谈tf.train.Saver()与tf.train.import_meta_graph的要点
2021/05/26 Python
详解Go与PHP的语法对比
2021/05/29 PHP
用 Python 定义 Schema 并生成 Parquet 文件详情
2021/09/25 Python
Redis的字符串是如何实现的
2021/10/24 Redis
Mysql排序的特性详情
2021/11/01 MySQL
CSS浮动引起的高度塌陷问题
2022/08/05 HTML / CSS