Loading [MathJax]/jax/output/CommonHTML/config.js
首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
社区首页 >问答首页 >使用事件绑定函数动态插入dom节点

使用事件绑定函数动态插入dom节点
EN

Stack Overflow用户
提问于 2011-02-15 18:28:00
回答 1查看 163关注 0票数 0

第一个堆栈溢出问题,所以要温和:)

我正在制作一个完全由javascript组成的chrome webapp,我想自己编写尽可能多的代码。因此,我必须做一些功能,如系统提示/警告未保存的文件。

为了使提示符功能尽可能可移植,逻辑是这样的:

代码语言:javascript
运行
AI代码解释
复制
function prompt (String message, assocArray commandname:function)  
Print message  
for each command  
make button and .bind click(function) to it

显然,我使用jQuery来实现这一点。

问题是,如何在不对选择器进行硬编码的情况下,用尽可能少的代码将单击事件上的函数绑定到未插入的Dom元素?

下一段代码是错误的,但它代表了我想要做的事情。

代码语言:javascript
运行
AI代码解释
复制
var message = "Document is not saved, do you want to save it now?";

    var options = {
        "yes": function(){alert("yes")},
        "no": function(){alert("no")},
        "cancel": function(){alert("cancel")}
    }

    systemPrompt = function(message, options){
        $("body").append("<div class='prompt'><div class='prompt_message'><p>"+message+"</p><div class='options'></div></div></div");
        var optionsContainer = $('.promt_mesage .options').append("<table><tr></tr></table>");
        for(command in options){
            optionContainer.append("<td>"+command+"</td>").bind('click', function(){
                options[command];
            });
        }
    };

与此相关的问题:如何获取新插入的dom元素?而不必对选择器进行硬编码?

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2011-02-15 18:37:28

多亏了事件委托,jQuery解决了这个问题。尝试.delegate()方法。

甚至在构建表的DOM之前就可以使用$('div.prompt').delegate('td', 'click', function(){ ... })。它将自动为稍后添加的元素工作。

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/5007834

复制
相关文章
java动态编译类文件并加载到内存中
  如果你想在动态编译并加载了class后,能够用hibernate的数据访问接口以面向对象的方式来操作该class类,请参考这篇博文-http://www.cnblogs.com/anai/p/4270214.html
程序员一一涤生
2019/09/10
3.2K0
云硬盘怎么挂载到linux?云硬盘可以挂载到任何系统吗?
云产品在现在的网络技术当中非常普遍和常用,很多大型的云产品公司推出了不同类型的硬盘以及云服务器,这些产品可以满足不同企业以及不同个人的网络用品需求,而且可以提供非常多丰富功能。云硬盘在某些公司或者个人使用当中已经取代了硬盘的功能,而且云硬盘拥有容易扩展以及存储文件安全的性能。现在来了解一下云硬盘怎么挂载到linux。
用户8715145
2022/03/23
12.1K0
JVM | 从类加载到JVM内存结构
我在上篇文章:JVM | 基于类加载的一次完全实践 中为你讲解如何请“建筑工人”来做一些定制化的工作。但是,大型的Java应用程序时,材料(类)何止数万,我们直接堆放在工地上(JVM)上吗?相反,JVM有着一套精密的管理机制,来确保类的加载、验证、解析和初始化等任务能够有序且高效地完成。
kfaino
2023/10/02
2820
JVM | 从类加载到JVM内存结构
Linux吃掉我的内存
在Windows下资源管理器查看内存使用的情况,如果使用率达到80%以上,再运行大程序就能感觉到系统不流畅了,因为在内存紧缺的情况下使用交换分区,频繁地从磁盘上换入换出页会极大地影响系统的性能。而当我
顶级程序员
2018/04/26
9970
Linux吃掉我的内存
数据库“炸了”,加CPU加内存?或许还有更好的解决方法!
之前在做业务应用系统压力测试项目的时候,发现大部分性能不达标的应用,问题都出在数据库上。数据库压力过大是每个业务经理都多多少少面临过的问题,那么解决的办法除了纵向提高数据库配置之外,是否还有其他更高效的途径呢?
嘉为蓝鲸
2021/09/01
1.5K0
我叫“毕加所”,不是毕加索。。。
我,腾讯家族的新成员。 跟兄弟姐妹一样,属鹅。 在与世界见面的第一天, 我想用歌声对你们说: 好险好险, 经过产品、PR、运营、技术的一夜battle, 终于,我叫—— 毕加所 来到这个世界上,我有自己的使命。 在歌声里, 你是否记得, 上次认识新同学是哪年? 你们之间有怎样的故事? 同窗时光总是短暂, 让毕业后的相聚更显珍贵。 因此,“毕加所”更要用切实行动告诉你, 毕业从此不散场。 为什么要办“毕加所”? 以AI加速器为始,腾讯按下产业孵化启动键。从AI、SaaS到WeCi
腾讯SaaS加速器
2020/06/09
5070
MONGODB 加索引 大内存 与连锁思维
创建MONGODB 的索引,属于基本操作,但如果是一个有2T 的 collection 要加一个索引,也属于基本操作,实际上量变产生质变,很多问题的考虑都不在那么简单。
AustinDatabases
2020/08/26
2.5K0
Spark在处理数据的时候,会将数据都加载到内存再做处理吗?
对于Spark的初学者,往往会有一个疑问:Spark(如SparkRDD、SparkSQL)在处理数据的时候,会将数据都加载到内存再做处理吗?
大数据学习与分享
2020/09/14
1.3K0
Spark在处理数据的时候,会将数据都加载到内存再做处理吗?
Linux吃掉了我的内存
在Windows下资源管理器查看内存使用的情况,如果使用率达到80%以上,再运行大程序就能感觉到系统不流畅了,因为在内存紧缺的情况下使用交换分区,频繁地从磁盘上换入换出页会极大地影响系统的性能。而当我们使用free命令查看Linux系统内存使用情况时,会发现内存使用一直处于较高的水平,即使此时系统并没有运行多少软件。这正是Windows和Linux在内存管理上的区别,乍一看,Linux系统吃掉我们的内存(Linux ate my ram),但其实这也正是其内存管理的特点。
马哥linux运维
2018/11/28
7300
Postgresql concurrently index 为什么可以在线加索引
提到在线加索引都是商业数据库的功能,例如SQL SERVER 在线加索引就是你花钱买的版本也必须是企业版, 标准版都不能在线加索引。POSTGRESQL 支持在线加索引的功能,在本文撰写期间MYSQL 是不支持 online add index 对于几千万的大表建立索引还是要使用工具,并且8.0 使用gh ost 是有我问题,所以对于大表加索引并且是8.0的情况还得是 pt-osc.
AustinDatabases
2021/08/06
8780
Postgresql  concurrently index  为什么可以在线加索引
建议收藏chatGPT说的加Ubuntu虚拟内存的教程
这个是当下最流行最时髦的AI神器chatGPT和我一起合作写的一篇通用技术文章,请读者笑纳!
江涛学编程
2023/05/27
1.3K0
建议收藏chatGPT说的加Ubuntu虚拟内存的教程
建议收藏chatGPT说的加Ubuntu虚拟内存的教程
这个是当下最流行最时髦的AI神器chatGPT和我一起合作写的一篇通用技术文章,请读者笑纳!
江涛学编程
2023/03/17
1.6K0
Springboot中maven需要加的配置
给maven 的settings.xml配置文件的profiles标签添加 <profiles> <profile> <id>jdk-1.8</id> <activation> <activeByDefault>true</activeByDefault> <jdk>1.8</jdk> </activation> <properties> <maven.compiler.source>1.8</maven.compiler
用户5927264
2019/08/01
1.3K0
GDS中如何加logo
好,言归正传,在GDS中打上自己的logo是一件很cool的事,而且有时候也是很必要的。
白山头
2020/06/29
1.1K0
为什么abstract @service注解的类不被加载到beanfactory中
使用过spring开发的开发者对@Service注解以及@Autowired注解不会陌生,系统在启动时会把@Service注解的类加载到BeanFactory中,然后就可以通过@Autowired注解的方式注入Service类实例,但并不是所以被@Service注解的类都会被加载到系统中,那么到底哪些类会被加载到系统中(也就是满足什么条件才会被加载呢),这个看下ClassPathScanningCandidateComponentProvider类的findCandidateComponents方法:
johnhuster的分享
2022/03/29
4690
Taro中如何将store加载到项目中
上面文章我们了解了如何创建store,最后导出时,在函数内部创建了store,所以导出时,函数需要调用,然后通过provicer组件将其注入到项目中。
挥刀北上
2022/05/11
7780
Taro中如何将store加载到项目中
利用Numpy中的ascontiguousarray可以是数组在内存上连续,加速计算
AttributeError: incompatible shape for a non-contiguous array
用户7886150
2021/01/02
2K0
将WordPress文章中的外链图片自动下载到本地
WordPress很多插件或者代码都可以实现在编辑文章中自动将外链图片下载到本地,最终我选择了一个叫:Easy Copy Paste的插件。
小狐狸说事
2023/11/17
5880
将WordPress文章中的外链图片自动下载到本地
React Hooks中这样写HTTP请求可以避免内存泄漏
译文来自 https://dev.to/somedood/best-practices-for-es2017-asynchronous-functions-async-await-39ji 原作者 Victor de la Fouchardière 译者: 蓝色的秋风(github/hua1995116) 大家好 !今天,让我们看一下在 React Hooks 中使用 fetch 和Abort Controller取消Web请求从而来避免内存泄露!当我们用 Fetch 来管理数据时,有时我们想取消请求(例如
秋风的笔记
2020/10/27
1.6K0
React Hooks中这样写HTTP请求可以避免内存泄漏
微信昵称可以加雪花了,个性又好看
这里先来看一下效果,我们可以看到昵称文字的上面有一个雪花的样式,感觉还是非常不错的!
@超人
2021/02/26
1.1K0
微信昵称可以加雪花了,个性又好看

相似问题

缓存页的最小缓存生存期与终止时间的差异

20

内部页缓存和动态页缓存之间的关系是什么?

10

禁用内部页缓存并启用动态页缓存

10

缓存页的过期时间为6小时

10

如何防止页的缓存?

20
添加站长 进交流群

领取专属 10元无门槛券

AI混元助手 在线答疑

扫码加入开发者社群
关注 腾讯云开发者公众号

洞察 腾讯核心技术

剖析业界实践案例

扫码关注腾讯云开发者公众号
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档
查看详情【社区公告】 技术创作特训营有奖征文