JS实现动态给标签控件添加事件的方法示例


Posted in Javascript onMay 13, 2017

本文实例讲述了JS实现动态给标签控件添加事件的方法。分享给大家供大家参考,具体如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<script language="javascript">
function set() {
  var obj = document.getElementById("fy");
  //obj.attachEvent('onfocus', add); //在原先事件上添加
  //obj.setAttribute('onfocus',add); //会替代原有事件方法
  //obj.onfocus=add;
  //等效obj.setAttribute('onfocus',add);
  if (window.addEventListener) {
    //其它浏览器的事件代码: Mozilla, Netscape, Firefox
    //添加的事件的顺序即执行顺序
    //注意用 addEventListener 添加带on的事件,不用加on
    obj.addEventListener('focus', add, false);
  } else {
    //IE 的事件代码 在原先事件上添加 add
    方法obj.attachEvent('onfocus', add);
  }
}
function add() {
  alert("已经成功添加事件");
}
</script>
<body>
  <input type="text" onfocus="alert('预设事件');" id="fy" />
  <input type="button" onclick="set();" value="sssss"/>
</body>
</html>

PS:这里再为大家附上javascript事件参考表供大家参考查询:

javascript事件与功能说明大全:
http://tools.3water.com/table/javascript_event

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
xml文档转换工具,附图表例子(hta)
Nov 17 Javascript
js获取页面传来参数的方法
Sep 06 Javascript
原生javascript实现简单的datagrid数据表格
Jan 02 Javascript
js实现禁止中文输入的方法
Jan 14 Javascript
Javascript实现单例模式
Jan 24 Javascript
最全面的JS倒计时代码
Sep 17 Javascript
JavaScript实现清空(重置)文件类型INPUT元素值的方法
Nov 17 Javascript
jfinal与bootstrap的登出实战详解
Nov 27 Javascript
vue.js-div滚动条隐藏但有滚动效果的实现方法
Mar 03 Javascript
使用JS获取页面上的所有标签
Oct 18 Javascript
Vue 页面权限控制和登陆验证功能的实例代码
Jun 20 Javascript
如何使用CocosCreator对象池
Apr 14 Javascript
jQuery插件FusionCharts绘制的2D条状图效果【附demo源码】
May 13 #jQuery
jQuery插件FusionCharts绘制的2D双柱状图效果示例【附demo源码】
May 13 #jQuery
vue.js 初体验之Chrome 插件开发实录
May 13 #Javascript
JS中cookie的使用及缺点讲解
May 13 #Javascript
jQuery中clone()函数实现表单中增加和减少输入项
May 13 #jQuery
jQuery遍历节点方法汇总(推荐)
May 13 #jQuery
基于angular实现三级联动的生日插件
May 12 #Javascript
You might like
解析PHPExcel使用的常用说明以及把PHPExcel整合进CI框架的介绍
2013/06/24 PHP
PHP的PDO操作简单示例
2016/03/30 PHP
thinkphp Apache配置重启Apache1 restart 出错解决办法
2017/02/15 PHP
一实用的实现table排序的Javascript类库
2007/09/12 Javascript
Javascript中Eval函数的使用说明
2008/10/11 Javascript
javascript面向对象编程(一) 实例代码
2010/06/25 Javascript
关于window.pageYOffset和document.documentElement.scrollTop
2011/04/05 Javascript
分享20款好玩的jQuery游戏
2011/04/17 Javascript
浅谈nodeName,nodeValue,nodeType,typeof 的区别
2015/01/13 Javascript
jQuery替换textarea中换行的方法
2015/06/10 Javascript
require.js 加载 vue组件 r.js 合并压缩的实例
2016/10/14 Javascript
Bootstrop实现多级下拉菜单功能
2016/11/24 Javascript
JavaScript中this的用法实例分析
2016/12/19 Javascript
nodejs实例解析(输出hello world)
2017/01/03 NodeJs
完美解决input[type=number]无法显示非数字字符的问题
2017/02/28 Javascript
js模仿微信朋友圈计算时间显示几天/几小时/几分钟/几秒之前
2017/04/27 Javascript
Bootstrap响应式导航由768px变成992px的实现代码
2017/06/15 Javascript
js数字滑动时钟的简单实现(示例讲解)
2017/08/14 Javascript
angular.js实现购物车功能
2017/10/23 Javascript
Bootstrap table中toolbar新增条件查询及refresh参数使用方法
2018/05/18 Javascript
通过vue刷新左侧菜单栏操作
2020/08/06 Javascript
[02:26]DOTA2英雄米拉娜基础教程
2013/11/25 DOTA
[01:31:03]DOTA2完美盛典全回顾 见证十五项大奖花落谁家
2017/11/28 DOTA
[01:46]新英雄登场
2019/09/10 DOTA
python 正则式 概述及常用字符
2009/05/07 Python
使用Python的Twisted框架实现一个简单的服务器
2015/04/16 Python
Python中字符串格式化str.format的详细介绍
2017/02/17 Python
Python爬虫通过替换http request header来欺骗浏览器实现登录功能
2018/01/07 Python
PyCharm的设置方法和第一个Python程序的建立
2019/01/16 Python
Python 数据库操作 SQLAlchemy的示例代码
2019/02/18 Python
python 3.74 运行import numpy as np 报错lib\site-packages\numpy\__init__.py
2019/10/06 Python
澳大利亚制造的蜡烛和扩散器:Glasshouse Fragrances
2018/05/20 全球购物
真正的英国宝藏:Mappin & Webb
2019/05/05 全球购物
论文致谢词范文
2015/05/14 职场文书
干货!开幕词的写作方法
2019/04/02 职场文书
深入理解go slice结构
2021/09/15 Golang