动态生成的DOM做点击事件无效
有时候我们的标签都是从后台获取的数据,然后利用JS添加到页面上,当我们写生成的标签的点击事件(click)时没有效果。
例如:
- <section>
- 测试动态生成的DOM点击事件
- <br />
- </section>
- <script src="jquery-1.11.2.min.js"></script>
- <script>
- $(function () {
- $.ajax({
- type: "post",
- url: "Handler1.ashx",
- data: {},
- success: function (data) {
- $("section").append(data); //把获取的标签动态添加到页面中
- }
- })
- });
- $("#test").click(function () {
- alert("Smile");
- })
- </script>
生成页面,点击A标签无效果。
这里只介绍两种解决方法。
①把事件写在生成的字符串当中,感觉很low
里面什么方法名外面就声明一个(需要带参就传参)。
②我一般喜欢在JS里面直接写点击事件,不喜欢在标签里面写事件
我们直接写这个标签的点击事件是没效果的,我们就换个写法,利用On来完成。
这样也可以完成点击事件。
另附:a标签的href也是可以执行脚本的,点击事件也会执行脚本,点击事件优先,然后在执行href链接。
下载一般都是把A标签的Href给个一般处理程序的链接(参数就用?传值)。但我这个下载的参数是动态生成的,在后台生成字符串的时候没有参数。需要在前台根据用户选择的来进行传递参数。所以需要我们动态生成Href的链接
- //下载
- $("#uploadInfo").click(function () {
- var uids = "";
- $(":checkbox[name='A']:checked").each(function (i, item) {
- uids += $(item).attr("data-id") + ",";
- })
- if (uids === "") {
- NewAlertBox("warning","请最少选择一项",);
- } else {
- var urls = "GroupTeamUserListDocUpload.ashx?CaseID=" + CaseID + "&UID=" + uids;
- $(this).attr("href", urls); //执行完了点击事件,把Href赋值,然后自动跳转href链接
- }
- });
动态生成的DOM做点击事件无效的更多相关文章
- jquery无法为动态生成的元素添加点击事件的解决方法
遇到 jquery无法为动态生成的元素添加点击事件,谷歌一下,整理一下解决方法如下: (<li>中间的元素是动态生成的), 现在想为<i>添加点击事件, 例子如下: <d ...
- Jquery中动态生成的元素没有点击事件或者只有一次点击事件
今天用jq做动态生成的元素的click事件时,click只执行了一次,当然有些朋友可能根本没执行, 执行了一次的原因是因为可能有函数加载了一遍,一次都没执行的可能是没绑定对象或者jq版本问题, 动态生 ...
- 动态生成的dom元素如何绑定事件
两种类型1.$('li').bind('click',function(){}); 当你用js动态添加li的时候,你添加的li不具有你绑定的事件.这种写法与$('li').click(function ...
- 动态生成的DOM不会触发onclick事件的原因及解决方法
最近朋友在做一个项目的时候,遇到动态加载微博内容,然后点击“展开评论”后获取该微博的所有评论.这里使用了动态加载的<span mid='123456789′ class='get_comment ...
- IOS - Safari中click点击事件无效
做web移动端页面时,安卓端一点问题也没,发现在ios真机上点击事件无效,发现Safari下只有默认可点击的元素才click点击事件,像span div等元素是不具有点击事件的. 解决问题四种方式: ...
- ListView的item中有button和checkbox,listview的点击事件无效
ListView的item中有button和checkbox,listview的点击事件无效,解决办法: 在item布局文件中的根控件中添加属性设置: android:descendantFocusa ...
- electron 点击事件无效
用CSS的 -webkit-app-region: drag;设置窗口可以移动后,点击事件无效 解决办法暂时不知道, 给点击的按钮加 -webkit-app-region: no-drag; 就可以点 ...
- Android 7.0 TextView点击事件无效修复方案
public class PostTextView extends TextView { private Handler handler = new Handler(Looper.getMainLoo ...
- jQuery绑定动态元素的点击事件无效
之前就一直受这个问题的困扰,在写ajax加载数据的时候发现,后面追加进来的demo节点元素,失去了之前的点击事件.为什么点击事件失效,我们该怎么去解决呢?那么,我们通过下面的示例简单说明. 示例如下: ...
随机推荐
- Big Data Opportunities and Challenges(by周志华)论文要点
大数据环境下的机器学习 三种误解:模型不再重要(大量数据上复杂模型依然提升显著,大数据是的复杂模型充分利用数据且难以过拟合),相关性就足够了(因果关系重要性无法被替代),以前的研究方向不再重要(高性能 ...
- jemeter、windox下安装教程
JMeter是Apache软件基金会的产品,用于对静态和动态的资源(文件,Servlet,Perl脚本,Java对象,数据库和查询,FTP服务器等等)的性能进行测试,是一款很方便的测试软件. 系统:w ...
- Hadoop2.X分布式集群部署
本博文集群搭建没有实现Hadoop HA,详细文档在后续给出,本次只是先给出大概逻辑思路. (一)hadoop2.x版本下载及安装 Hadoop 版本选择目前主要基于三个厂商(国外)如下所示: 基于A ...
- python 中文分词:结巴分词
中文分词是中文文本处理的一个基础性工作,结巴分词利用进行中文分词.其基本实现原理有三点: 基于Trie树结构实现高效的词图扫描,生成句子中汉字所有可能成词情况所构成的有向无环图(DAG) 采用了动态规 ...
- BNU 27847——Cellphone Typing——————【字典树】
Cellphone Typing Time Limit: 5000ms Memory Limit: 131072KB This problem will be judged on UVA. Origi ...
- Lua 遍历Linux目录下的文件夹
代码如下,里面有注释,应该能看懂. function getFile(file_name) local f = assert(io.open(file_name, 'r')) local string ...
- c#-day02学习笔记
类型转化 为什么要类型转化:因为C#语言是强类型的语言,所以区分了很多的类型,类型和类型之间是不能直接赋值的,如果要赋值 就需要转换类型 类型转换分为两大类: 第一类:隐式转换 隐式转换是系统默认的转 ...
- PS基础,数学,语文
PS基础(修图) 污点修复画笔工具---设置画笔大小---设置类型(内容识别)---修改图片---完成. 修复画笔工具---设置画笔大小---设置源(取样)---修改图片---完成. 修补工具---设 ...
- 管理员账户权限不足 解决方案 类似没有XXX权限之类的问题解决方法
- Python函数(2)
一.函数对象 函数是第一类对象:指的是函数名指向的值可以被当作数据去使用. 1.函数可以被引用 例如: 2.可以当作参数传递给另一个函数 例如: 3.可以当作一个函数的返回值 例如: 4.可以当作容器 ...