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动态创建的对象绑定事件的更多相关文章

  1. js动态创建的元素绑定事件

    新创建的元素用传统的办法无法绑定,需要用live方法. 例: $('.rule').live('mouseover', function () { $(this).addClass("can ...

  2. js动态添加的元素绑定事件

    最近做的项目要实现一个动态添加动态删除的功能,思考了一下,该怎么给动态添加的元素绑定事件.最后觉得有两种方式比较可靠,第一种是在动态添加的html代码里添加oclick事件,然后给传个唯一的参数来判断 ...

  3. 如何给js动态创建的dom添加事件

    delegate() 方法 实例 当点击鼠标时,隐藏或显示 p 元素: $("div").delegate("button","click" ...

  4. js动态添加的html绑定事件

    使用场景:网站上ul里面的li数据需要从后台数据查询出来即通过js添加数据.然后监听点击li点击事件. 添加数据代码: for(var i = 0; i < table.length; i++) ...

  5. 使用addeventlistener为js动态创建的元素添加事件监听

    点击li弹出内容,并且动态添加li之后有效 <button onclick="addFunction()">点我增加</button> <ul> ...

  6. js动态创建类对象

    1.定义函数,函数中定义类对象 f1=function(){ //定义类 function Pannel(name){ this.name = name; this.print = function( ...

  7. Jquery给动态生成的对象绑定事件

    $(document).on("blur", ".Text1", function () { var index = this.id.replace('txtS ...

  8. JS,Jquery,ExtJs不同脚本动态创建DOM对象

    好久不来写东西了,这段时间太慢了,闲了下来看了几篇文章,觉得很好,同时也许咱们大家都能遇到,所以就把它记录下来... 简单使用JavaScript.JQuery.ExtJs进行DOM对象创建的测试,主 ...

  9. JS、JQuery和ExtJs动态创建DOM对象

    做了个简单使用JavaScript.JQuery.ExtJs进行DOM对象创建的测试,主要是使用JavaScript.JQuery.ExtJs动态创建Table对象.动态Table数据填充.多选控制. ...

随机推荐

  1. css3隐藏导航栏总结

    display:none隐藏display:block显示 1.通过hover显示时隐藏元素必须与触发元素存在着关系(父子,兄弟)才能生效,所以推荐用JS完成比较好. 2.隐藏部分的属性直接写在hov ...

  2. HDU 2080 夹角有多大II (数学) atan(y/x)分类求角度

    夹角有多大II Problem Description 这次xhd面临的问题是这样的:在一个平面内有两个点,求两个点分别和原点的连线的夹角的大小.注:夹角的范围[0,180],两个点不会在圆心出现. ...

  3. 跨域资源共享CORS详解

    简介 CORS是一个W3C标准,全称是"跨域资源共享"(Cross-origin resource sharing). 它允许浏览器向跨源服务器,发出XMLHttpRequest请 ...

  4. PHP:基于百度大脑api实现OCR文字识别

    有个项目要用到文字识别,网上找了很多资料,效果不是很好,偶然的机会,接触到百度大脑.百度大脑提供了很多解决方案,其中一个就是文字识别,百度提供了三种文字识别,分别是银行卡识别.身份证识别和通用文字识别 ...

  5. 使用Dotfuscator加密混淆程序以及如何脱壳反编译

    混淆演示 首先介绍如何使用Dotfuscator对.net程序加密码混淆/加壳 C#或vb.net编写的应用程序或DLL. 这里随便创建了一个C#的命令行控制台程序.程序很简单,对当前的时间进行了AE ...

  6. Thinkphp模板简单入门

    Thinkphp模板概述: ThinkPHP内置了一个基于XML的性能卓越的模板引擎,这是一个专门为ThinkPHP服务的内置模板引擎,使用了XML标签库技术的编译型模板引擎,支持两种类型的模板标签, ...

  7. TCP协议总结

    TCP的特性 TCP提供一种面向连接的.可靠的字节流服务 在一个TCP连接中,仅有两方进行彼此通信.广播和多播不能用于TCP TCP使用校验和,确认和重传机制来保证可靠传输 TCP给数据分节进行排序, ...

  8. [刷题]算法竞赛入门经典(第2版) 6-1/UVa673 6-2/UVa712 6-3/UVa536

    这三题比较简单,只放代码了. 题目:6-1 UVa673 - Parentheses Balance //UVa673 - Parentheses Balance //Accepted 0.000s ...

  9. 仿中关村win8频道(win8.zol.com.cn)下的tab效果

    最近觉得中关村win8频道下的那个Tab效果很好看. 一时兴起就自己做了一个.觉得还蛮不错的,特地来给大家分享一下.以下是相关的HTML页面写法: <div class="popula ...

  10. PHP 中级内容

    1.面向对象编程(OOP) 2.模板引擎(smarty) 3.MYSQL(中级操作) 数据库抽象层(PDO): 4.Ajax(异步刷新) 5.Js框架(jQuery) Xml+JSON数据       ...