jQuery动态添加元素事件
在项目中遇到需要jQuery动态添加元素的事件,做了一个demo,方便以后遇到相同的问题可以用上:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<script type="text/javascript" src="js/jquery-1.7.1.min.js" ></script>
</head>
<body>
<div class="clickAdd"><input type="button" value="按钮"></div>
<br />
<br />
<br />
<span class="clickCon">在我的左边添加了一段话,这段话是:</span>
<script type="text/javascript">
$(function(){
//动态添加事件
$(".clickAdd").on("click",function(){
console.log("追加了内容");
$(".clickCon").append('<span class="delete">点击我可以删除我,来试试!</span>');
});
//对动态添加的元素添加事件-删除
$(".clickCon").on("click",".delete",function(){
console.log("内容删除成功");
$(this).remove();
});
});
</script>
</body>
</html>
jQuery动态添加元素事件的更多相关文章
- jquery动态添加元素无法触发绑定事件的解决方案。
jquery动态添加元素无法触发绑定的事件的解决方案. ╭(●`∀´●)╯二狗最近在工作中遇到一个问题,即当用jquery动态添加元素后,发现给动态添加的元素却无法触发事件(╯#-_-)╯╧═╧ ( ...
- Jquery动态添加元素并给元素增加onchange相应
动态添加元素: $select = $("<select></select>"); $("<option></option> ...
- jquery动态添加元素无法触发绑定的事件的解决方案
方法一:绑定live事件(live事件只在jquery1.9以下才支持,高版本不支持). //jquery 1.9(不包括1.9)以下可以 $(".btn").live(" ...
- Jquery 动态添加元素 添加点击事件
给动态添加的元素添加js事件,不能直接添加js事件,需要借助on( )方法,给选择器指定的子元素添加事件处理函数,并非选择器本身: 1. 语法 $(selector).on(event,childSe ...
- jQuery动态添加元素并绑定事件
写网页的时候常常需要根据实际情况添加新的元素,然后这些新元素还需要绑定已有的事件,如:有一ul,点击其中某 li,根据其 id 或 value 等获取新的数据列表,并新建 ul 显示,新 ul 中的 ...
- jQuery 新添加元素事件绑定无效
jQuery中事件绑定,大多使用on就足够了. 但是对于新添加的元素 on 的绑定事件 会不起作用. 因为 append 中的 节点是在整个文档加载之后才添加的,页面并不会为未来的元素初始化添加点击事 ...
- jQuery动态添加元素,并提交json格式数据到后台
参考:https://www.cnblogs.com/shj-com/p/7878727.html 下载 下载该插件的地址是:http://www.bootcdn.cn/jquery.serializ ...
- Jquery 动态添加元素后,获取不到元素对象情况
- jqery 动态添加元素 绑定事件
jQuery动态添加元素: var url = "...";//服务地址 $.ajax({ type: 'post', url: url, data:{fireId:fireId} ...
随机推荐
- 【CentOS如何最小化安装】
近来发现越来越多的运维小伙伴们都有最小化安装系统的洁癖,因此,找老男孩来咨询,这个"洁癖"好习惯啊,必须支持,,因此发布本文和大家分享下. (1)系统安装类型选择及自定义额外包组 ...
- qt5.5.0成功移植到IMX6中
前阵子移植qt4.8.5到板子上成功后,总想着qt4有点旧,于是就想着玩qt5,之前都是在Windows7上写qt,写了个游戏,感觉还不错,但毕竟不能只能在PC机上跑,现在由于项目需要,要将qt搞到I ...
- iOS 手势识别
首先给大家解释一下为什么要学习手势识别? 如果想监听一个UIView上面的触摸事件,之前的做法是: 自定义一个UIView : 实现UIView的touches方法,在方法里面实现具体功能 透过tou ...
- cmd 快捷操作
鼠标右键命令行快捷方式设置 将下面的文本存成CommandPrompt.reg 文件,然后双击导入到注册表即可 Windows Registry Editor Version 5.00 [HKEY_C ...
- Shell 脚本计算时间差
在shell脚本中统计程序执行完毕所需要的时间不像在java中使用System.currentTimeMillis()方便 稍微记录一下,以供备用,免得又去花时间想(统计程序执行消耗多少s): sta ...
- JTree单击事件
import javax.swing.*; import javax.swing.tree.*; import java.awt.FlowLayout; import java.awt.GridLay ...
- C#删除只读文件或文件夹(解决File.Delete无法删除文件)
引用: http://www.jb51.net/article/72181.htm C#删除只读文件的方法: if (File.GetAttributes(FFName).ToString().I ...
- jQuery Validate【强大的表单验证】
一.引入菜鸟教程提供的 1.14.0 版本下载地址:http://static.runoob.com/download/jquery-validation-1.14.0.zip <script ...
- gulp插件大全
原文:http://www.mamicode.com/info-detail-517085.html No.1.run-sequence 作用:让gulp任务,可以相互独立,解除任务间的依赖,增强 ...
- Vimperator技巧
Vimperator技巧 什么是Vimperator?Firefox的一个插件,模拟vim操作. 1. 用]]打开"下一页"链接,[[打开"上一页"Vimper ...