delegate说起对未来元素是其作用的，于是写下代码：

<!DOCTYPE HTML>

<html>

<head>

    <meta charset="utf-8">

    <meta http-equiv="x-ua-compatible" content="ie=edge">

    <meta name="viewport" content="width=device-width, initial-scale=1">

    <title>知几 - 教师端</title>

    <meta name="description" content="">

    <link rel="apple-touch-icon" href="http://cdn.dev.tiplus.cn/client-teacher/apple-touch-icon.png">

    <script type="text/javascript" src="jquery.min.js"></script>

</head>

<body>

<p class="xxx">click</p>

<div id="a"></div>

<li class="add_reason"><span>xx</span></li>

<script type="text/javascript">

$(".xxx").click(function(){

    $("#a").append('<li class="add_reason"><span style="display:block;">xx</span></li>');

})

$(".add_reason").delegate("span", "click",function(){

    alert("ddd");

});

</script>

</body>

</html>

其实不然，对与通过点击xxx元素新加的html，根本没有作用。

错误： 页面出现动态添加元素时，添加元素的事件用普通的方法，无法响应。

原因： 普通添加的事件，只是在document.ready时绑定的已有元素事件，所以动态添加的元素，在document.ready时不存在，所以也无法绑定元素事件，无法对事件进行响应。

这时候，需要用到上面的三个绑定方法；这三个方法只所以成功，是因为这三个方法是绑定到document上，如果元素发生变化，也都是从document开始找，动态添加的元素也能被重新查找时所发现，所以事件能够响应。换成如下代码，成功执行：

<!DOCTYPE HTML>

<html>

<head>

    <meta charset="utf-8">

    <meta http-equiv="x-ua-compatible" content="ie=edge">

    <meta name="viewport" content="width=device-width, initial-scale=1">

    <title>知几 - 教师端</title>

    <meta name="description" content="">

    <link rel="apple-touch-icon" href="http://cdn.dev.tiplus.cn/client-teacher/apple-touch-icon.png">

    <script type="text/javascript" src="jquery.min.js"></script>

</head>

<body>

<p class="xxx">click</p>

<div id="a"></div>

<li class="add_reason"><span>xx</span></li>

<script type="text/javascript">

$(".xxx").click(function(){

    $("#a").append('<li class="add_reason"><span style="display:block;">xx</span></li>');

})

$(document).on('click', '.add_reason',function() {

    alert("2");

});

</script>

</body>

</html>

完毕。

jquery添加未来元素时，其绑定事件不起作用解决办法的更多相关文章

  1. js/jq 动态添加的元素不能触发绑定事件解决方案

    <!-- Copyright 2017-10-27, Jachin QQ: 381558301 Email: 381558301@qq.com 请看看你们的版本并对号入座: jquery1.6版 ...

  2. 向SDE图层中添加大量数据时，出现ORA-00604以及ORA-01000的解决办法

    转自原文 向SDE图层中添加大量数据时,出现ORA-00604以及ORA-01000的解决办法 写了一个小程序,从一个列表中读取坐标串,每个坐标串生成一个IPolygon,然后将这些Polygon添加 ...

  3. jQuery on()方法绑定动态元素的点击事件无响应的解决办法

    $('#check_all').on('click' , function(){ alert(1); }); $("#yujinlist").append(html); count ...

  4. 分别使用原生js和jQuery添加/删除元素的class属性

    一.原生js添加/删除元素的class属性: <!-- span元素原有class = "test" --> <span class="test&quo ...

  5. jQuery添加删除元素

    $(document).ready(function () { $('#radioExtranet').on('click', function () { showProjectInformation ...

  6. jquery点击事件失效原因和解决办法

    在使用jQuery绑定点击事件的时候,有时候会遇到点击无效,这种情况大多出现在动态添加元素的时候 例如:给demo里添加li元素给li绑定点击事件 $("#demo").appen ...

  7. JQ绑定事件的叠加和解决，index()方法的坑

    JQ绑定事件的叠加和解决,index()方法的坑 前言 在做过几个不大不小的项目后,发现技术这种东西,必须要多多实践,才能发现各种问题,理论的知识掌握的再好终究是纸上谈兵. 因此目前感觉有两点是必须要 ...

  8. 重装Oracle时出现SID已存在问题的解决办法

    重装Oracle时出现SID已存在问题的解决办法    手机打开 注意安装oracle服务器的环境,不稳定导致数据库出现问题,后果很严重! 方法如下: 1.开始->设置->控制面板-&g ...

  9. VMware下ubuntu与win8共享文件时/mnt/hgfs目录为空的解决办法

    VMware下ubuntu(guest)与win8共享文件时/mnt/hgfs目录为空的解决办法 环境:VMware-player-5.0.2-1031769 + ubuntu13.04 1.安装vm ...

随机推荐

  1. VMware中创建Ubuntu16.0.4虚拟桥连方式无法上网

    一.问题描述 在本地VMvare中已经安装了两台虚拟机,网络方式都是桥连,上网都可以自动获取IP地址 和HOST主机是一个号段的 ,同为192.168.1.X KingServer1(原始安装)  桥 ...

  2. 在java中像js那样处理json数据

    工作中经常需要通过ajax向前台返回json数据,都是通过拼字符串拼出来的,很发麻烦不说,还容易出错. 于是想,能不能像js那样操作json呢?或者说更方便的操作呢? Google的gson就是这样的 ...

  3. 互联网公司linux运维生产场景常用软件工具一览

    linux的世界真的很精彩,还没入门的朋友赶紧进来吧! 操作系统:Centos※,Freebsd,Ubuntu,Redhat linux,suse linux网站服务:apache※,nginx※,l ...

  4. 界面为ScrollView时打开界面会自动滚动到底部之解决方法

    开发中遇到了这样的一个问题,界面最外层是ScrollView,然后里面有嵌套了一个ListView还有其他可以获取焦点的View,然后每次打开界面都会自动滚动到最底部,经过一番折腾,发现了一个简单的方 ...

  5. ArcGIS Add-in ValidateAddInXMLTask”任务意外失败

    晚上收假回来调一Add-In程序,遇到编译错误:"ValidateAddInXMLTask"任务意外失败. error MSB4018: System.IO.FileNotFoun ...

  6. iOS 两个应用之间的切换

    A 跳到B NSURL *urlT = [NSURL URLWithString:@"TestB://XXXXXXX"]; //注意“://”后面可以任意传参数.这些参数传过去后当 ...

  7. Swift语言精要 - 浅谈结构体(Struct)

    CGRect, CGSize, CGPoint这些是 . String, Int, Array, Dictionary这些我们经常用的也是结构体(Struct). 那么结构体(Struct)到底是什么 ...

  8. 默认的Sublime 3中没有Package Control

    https://packagecontrol.io/installation#st3 (官方) 原来Subl3安装Package Control很麻烦,现在简单的方法来了 一.简单的安装方法 使用Ct ...

  9. nyoj 119士兵杀敌（三）(线段树区间最值查询，RMQ算法)

    题目119 题目信息 执行结果 本题排行 讨论区 士兵杀敌(三) 时间限制:2000 ms  |  内存限制:65535 KB 难度:5 描写叙述 南将军统率着N个士兵,士兵分别编号为1~N,南将军常 ...

  10. Unity3D调用android方法（非插件方式）

    关于Unity3Dproject与androidproject的转换与合并,请參考我的另外一篇博客.假设你对Unity3Dproject增加到androidproject的过程不熟悉.也请先看完以下这 ...