给js动态创建的对象绑定事件
1、使用原生JS动态为动态创建的对象绑定事件
1-1、创建一个function,用来兼容IE8以下浏览器添加事件
function addEvent(el, type, fn) {
if(el.addEventListener){
el.addEventListener(type,fn,false)
}else if(el.attachEvent()){
el.attachEvent('on' + type,fn,false)
}else{
return false
}
}
1-2、使用JS创建对象,调用上面的方法
function append(){
var body=document.getElementsByTagName('body')[0];
var btn=document.createElement('button');
btn.type='button';btn.innerHTML='测试';btn.id='test';
addEvent(btn,'click',function(){
//触发click代码
console.log('buton按钮')
})
body.appendChild(btn);
}
append() //执行append方法
2、使用jQuery为动态创建的对象绑定事件
var btn = document.createElement('button')
$(btn).attr("type","button")
$(btn).html('确定')
$(btn).click(function(){
console.log(this.tagName) //结果:BUTTON
})
$("body").append(btn)
给js动态创建的对象绑定事件的更多相关文章
- js动态创建的元素绑定事件
新创建的元素用传统的办法无法绑定,需要用live方法. 例: $('.rule').live('mouseover', function () { $(this).addClass("can ...
- js动态添加的元素绑定事件
最近做的项目要实现一个动态添加动态删除的功能,思考了一下,该怎么给动态添加的元素绑定事件.最后觉得有两种方式比较可靠,第一种是在动态添加的html代码里添加oclick事件,然后给传个唯一的参数来判断 ...
- 如何给js动态创建的dom添加事件
delegate() 方法 实例 当点击鼠标时,隐藏或显示 p 元素: $("div").delegate("button","click" ...
- js动态添加的html绑定事件
使用场景:网站上ul里面的li数据需要从后台数据查询出来即通过js添加数据.然后监听点击li点击事件. 添加数据代码: for(var i = 0; i < table.length; i++) ...
- 使用addeventlistener为js动态创建的元素添加事件监听
点击li弹出内容,并且动态添加li之后有效 <button onclick="addFunction()">点我增加</button> <ul> ...
- js动态创建类对象
1.定义函数,函数中定义类对象 f1=function(){ //定义类 function Pannel(name){ this.name = name; this.print = function( ...
- Jquery给动态生成的对象绑定事件
$(document).on("blur", ".Text1", function () { var index = this.id.replace('txtS ...
- JS,Jquery,ExtJs不同脚本动态创建DOM对象
好久不来写东西了,这段时间太慢了,闲了下来看了几篇文章,觉得很好,同时也许咱们大家都能遇到,所以就把它记录下来... 简单使用JavaScript.JQuery.ExtJs进行DOM对象创建的测试,主 ...
- JS、JQuery和ExtJs动态创建DOM对象
做了个简单使用JavaScript.JQuery.ExtJs进行DOM对象创建的测试,主要是使用JavaScript.JQuery.ExtJs动态创建Table对象.动态Table数据填充.多选控制. ...
随机推荐
- 编写一个简单的java服务器程序
import java.net.*;import java.io.*; public class server{ ); //监听在80端口 Socket sock = server.accept(); ...
- js,jQuery和DOM操作的总结(一)
废话不说,直接上图 一 js的基本操作 (1)js 的六种数据类型 var n4;//六种数据类型用typeof来确定类型,Null类型的用typeof是不行的,这个是特殊 alert(typeof ...
- TP5.0 PHPExcel 数据表格导出(原)
今天看的是PHPExcel这个扩展库,Comporse 下载不下来,最后只能自己去github里面手动下载,但有一个问题就是下载下来的PHPExcel没有命名空间,所以框架里面的use根本引入不进去, ...
- c#枚举值增加特性说明
c#枚举值增加特性说明 通过特性给一个枚举类型每个值增加一个字符串说明,用于打印或显示. 自定义打印特性 [AttributeUsage(AttributeTargets.Field)] public ...
- ECMAScript迭代语句
迭代语句又叫循环语句,声明一组要反复执行的命令,直到满足某些条件为止. 循环通常用于迭代数组的值(因此而得名),或者执行重复的算术任务. do-while, while, for, for-in -- ...
- 由"永恒之蓝"病毒而来的电脑科普知识
永恒之蓝病毒事件: 继英国医院被攻击,随后在刚刚过去的5月12日晚上20点左右肆虐中国高校的WannaCry勒索事件,全国各地的高校学生纷纷反映,自己的电脑遭到病毒的攻击,文档被加密,壁纸遭到篡改,并 ...
- Python数据类型之变量
变量 在程序设计中,变数(英语:Variable,scalar)是指一个包含部分已知或未知数值或资讯(即一个值)之储存位址,以及相对应之符号名称(识别字).通常使用变数名称参照储存值:将名称和内容分开 ...
- JavaScript之onXXXX事件和addEventListener的区别
JavaScript之onXXXX事件和addEventListener的区别 1.首先介绍两者的用法: 1.1onXXXX的用法:以onclick为例 第一种: obj.onclick = func ...
- wdc网站部署问题
最近公司新买了一个服务器,将项目迁移到新服务器上,按照wdcp安装方法,部署了lnamp环境,具体方法如下: 安装方法1 只安装wdcp面板看看wget http://down.wdlinux.cn/ ...
- 我必须得告诉大家的MySQL优化原理
本文转载自http://www.jianshu.com/p/d7665192aaaf 说起MySQL的查询优化,相信大家积累一堆技巧:不能使用SELECT *.不使用NULL字段.合理创建索引.为字段 ...