在写ajax加载数据的时候发现,后面添加进来的demo节点元素,失去了之前的点击事件。

其实最简单的方法就是直接在标签中写onclick="",但是这样写有些场景的是实现不了的,最好的方式还是通过给类名绑定一个click事件。

方法一:使用live:

live()函数会给被选的元素绑定上一个或者多个事件处理程序,并且规定当这些事件发生时运行的函数。通过live()函数适用于匹配选择器的当前及未来的元素。比如,通过脚本动态创建的元素。

代码示例:

$('.demo1').live('click', function(){
alert('OK');
});

  

方法二:使用on:

可以通过on方法绑定事件,可以绑定到它的父级或者body中

代码示例:

$("#demo").on('click','.demol',function(){
alert('OK')
});

  

js中 ajax动态新增节点无法触发点击事件的更多相关文章

  1. 解决jQuery ajax动态新增节点无法触发点击事件的问题

    在写ajax加载数据的时候发现,后面添加进来的demo节点元素,失去了之前的点击事件.为什么点击事件失效,我们该怎么去解决呢? 其实最简单的方法就是直接在标签中写onclick="" ...

  2. 关于AJAX异步加载节点无法触发点击事件问题的解决方式

    做练习的过程中遇到一个问题,使用AJAX异步新增一个节点,无法触发点击事件,经过查阅之后知道一个方式,使用JS的委托事件,在此做一个记录. $(document).on('click', '.recr ...

  3. js中怎么为同级元素添加点击事件

    事件件是javascript脚本语言的重要组成部分,因为有事件才使用户页面的体验更加的美好.元素添加事件是js语言中最基础的.我们可以为元素本身添加事件,也可以通过事件绑定和事件监听为元素的父元素和子 ...

  4. angular JS中使用jquery datatable添加checkbox点击事件

    'use strict'; app.controller('DataTableCtrl', function ($scope, $compile) { $scope.selected = []; $s ...

  5. js中ajax如何解决跨域请求

    js中ajax如何解决跨域请求,在讲这个问题之前先解释几个名词 1.跨域请求 所有的浏览器都是同源策略,这个策略能保证页面脚本资源和cookie安全 ,浏览器隔离了来自不同源的请求,防上跨域不安全的操 ...

  6. prototype.js 和 jQuery.js中 ajax 的使用

    这次还是prototype.js 和 jQuery.js冲突的问题,前面说到过解决办法http://www.cnblogs.com/Joanna-Yan/p/4836252.html,以及上网说的大部 ...

  7. js中ajax连接服务器open函数的另外两个默认参数get请求和默认异步(open的post方式send函数带参数)(post请求和get请求区别:get:快、简单 post:安全,量大,不缓存)(服务器同步和异步区别:同步:等待服务器响应当中浏览器不能做别的事情)(ajax和jquery一起用的)

    js中ajax连接服务器open函数的另外两个默认参数get请求和默认异步(open的post方式send函数带参数)(post请求和get请求区别:get:快.简单 post:安全,量大,不缓存)( ...

  8. vue中Enter触发登录事件和javascript中Enter触发点击事件

    created(){ window.addEventListener('keydown', this.handleKeyDown, true)//开启监听键盘按下事件 } 在methods中当keyC ...

  9. JS实现按下按键触发点击事件

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

随机推荐

  1. redo/declare/typeset

    变量设置功能,都是由命令行直接设置的,那么,可不可以让使用者能够经由键盘输入? 什么意思呢?是否记得某些程序执行的过程当中,会等待使用者输入 "yes/no"之类的讯息啊? 在 b ...

  2. Docker 更新镜像

    docker镜像如下: 今天在运行的容器内使用 apt-get update 命令进行更新时,发下很多404错误. Err http://archive.ubuntu.com wily-updates ...

  3. 零基础学Python--------第7章 面向对象程序设计

    第7章 面向对象程序设计 7.1 面向对象概述 面向对象(Object Oriented)的英文缩写是OO,它是一种设计思想.从20世纪60年代提出面向对象的概念到现在,它已经发展成为一种比较成熟的编 ...

  4. react 函数子组件(Function ad Child Component)

    今天学习了react中的函数子组件的概念,然后在工作中得到了实际应用,很开心,那么好记性不如烂笔头,开始喽~ 函数子组件(FaCC )与高阶组件做的事情很相似, 都是对原来的组件进行了加强,类似装饰者 ...

  5. iOS----------拨打电话的3种方式

    iOS实现拨打电话的方式:   方法一.requestWithURL,此方法拨打前弹出提示 NSMutableString * string = [[NSMutableString alloc] in ...

  6. C#监控指定目录的文件变化的代码

    如下的资料是关于C#监控指定目录的文件变化的代码. FileSystemWatcher watcher = new FileSystemWatcher();watcher.Path = @" ...

  7. Android 修改包名,导致安装错误

    一.app运行安装时出错 [安装时出错]: [百度翻译] 安装失败的消息未能敲定会议:install_failed_invalid_apk:/数据/应用程序/ vmdl292154713.tmp/9_ ...

  8. 单台MongoDB实例开启Oplog

    背景 随着数据的积累,MongoDB中的数据量越来越大,数据分析团队从数据库中抽取变化数据(假如依据栏位createdatetime,transdatetime),越来越困难.我们知道MongoDB的 ...

  9. CFS调度器(1)-基本原理

    首先需要思考的问题是:什么是调度器(scheduler)?调度器的作用是什么?调度器是一个操作系统的核心部分.可以比作是CPU时间的管理员.调度器主要负责选择某些就绪的进程来执行.不同的调度器根据不同 ...

  10. Swift NSAttributedString的使用

    NSMutableAttributedString let testAttributes = [NSAttributedStringKey.foregroundColor: UIColor.blue, ...