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 相关文章推荐
一样的table?不一样的table(可编辑状态table)
Sep 19 Javascript
node.js中的fs.open方法使用说明
Dec 17 Javascript
jQuery中[attribute]选择器用法实例
Dec 31 Javascript
js实现时间显示几天前、几小时前或者几分钟前的方法集锦
May 29 Javascript
理解Javascript文件动态加载
Jan 29 Javascript
浅谈js中function的参数默认值
Feb 20 Javascript
JavaScript 数据类型详解
Mar 13 Javascript
全面解析vue中的数据双向绑定
May 10 Javascript
Vue2.0实现购物车功能
Jun 05 Javascript
使用electron实现百度网盘悬浮窗口功能的示例代码
Oct 24 Javascript
Vue Cli 3项目使用融云IM实现聊天功能的方法
Apr 19 Javascript
Angular8路由守卫原理和使用方法
Aug 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
php 什么是PEAR?
2009/03/19 PHP
深入密码加salt原理的分析
2013/06/06 PHP
PHPAnalysis中文分词类详解
2014/06/13 PHP
php图片处理函数获取类型及扩展名实例
2014/11/19 PHP
Apache服务器下防止图片盗链的办法
2015/07/06 PHP
thinkPHP实现将excel导入到数据库中的方法
2016/04/22 PHP
php实现的pdo公共类定义与用法示例
2017/07/19 PHP
在laravel5.2中实现点击用户头像更改头像的方法
2019/10/14 PHP
不错的新闻标题颜色效果
2006/12/10 Javascript
js 覆盖和重载 函数
2009/09/25 Javascript
面向对象设计模式的核心法则
2013/11/10 Javascript
javascript折半查找详解
2015/01/26 Javascript
javascript中checkbox使用方法简单实例演示
2015/11/17 Javascript
Bootstrap中的Panel和Table全面解析
2016/06/13 Javascript
前端分页功能的实现以及原理(jQuery)
2017/01/22 Javascript
angular将html代码输出为内容的实例
2018/09/30 Javascript
移动端滑动切换组件封装 vue-swiper-router实例详解
2018/11/25 Javascript
jQuery实现为table表格动态添加或删除tr功能示例
2019/02/19 jQuery
在nodejs中创建child process的方法
2021/01/26 NodeJs
[04:11]2014DOTA2国际邀请赛 CIS遗憾出局梦想不灭
2014/07/09 DOTA
python实现文件路径和url相互转换的方法
2015/07/06 Python
Python字符串特性及常用字符串方法的简单笔记
2016/01/04 Python
详解Python设计模式编程中观察者模式与策略模式的运用
2016/03/02 Python
Python文件操作,open读写文件,追加文本内容实例
2016/12/14 Python
python3+selenium自动化测试框架详解
2019/03/17 Python
Pytorch中的VGG实现修改最后一层FC
2020/01/15 Python
基于Python实现天天酷跑功能
2021/01/06 Python
解决pytorch 数据类型报错的问题
2021/03/03 Python
利用Canvas模仿百度贴吧客户端loading小球的方法示例
2017/08/13 HTML / CSS
Timberland德国官网:靴子、鞋子、衣服、夹克及配件
2019/12/10 全球购物
JDO的含义
2012/11/17 面试题
优秀大学生职业生涯规划书
2014/02/27 职场文书
法定代表人证明书
2014/11/28 职场文书
给女朋友的道歉短信
2015/05/12 职场文书
办公用品管理制度
2015/08/04 职场文书
MySQL中dd::columns表结构转table过程及应用详解
2022/09/23 MySQL