开发者社区

文档建议反馈控制台

最新优惠活动

文章/答案/技术大牛

发布

动态生成的按钮不能通过jQuery工作

可能是由于以下几个原因：

事件绑定问题：动态生成的按钮需要使用事件委托的方式进行事件绑定，而不是直接使用$(selector).click()这样的方式。可以使用$(document).on('click', selector, function(){})来绑定事件，其中selector是动态生成按钮的父元素选择器。
时机问题：如果动态生成的按钮在jQuery代码执行之前就已经存在于页面中，那么在jQuery代码执行时，这些按钮还不存在于DOM中，因此无法绑定事件。解决方法是将jQuery代码放在动态生成按钮的代码之后执行，或者使用$(document).ready(function(){})来确保DOM加载完成后再执行jQuery代码。
选择器问题：如果动态生成的按钮的选择器与jQuery代码中使用的选择器不匹配，那么无法正确选中按钮进行事件绑定。可以通过查看生成按钮的HTML结构，确定正确的选择器。
jQuery库加载问题：如果动态生成按钮的代码在jQuery库加载之前执行，那么jQuery函数将无法使用。确保jQuery库在动态生成按钮的代码之前加载。

总结起来，解决动态生成按钮不能通过jQuery工作的问题，需要正确绑定事件、确保时机、使用正确的选择器，并确保jQuery库加载完成。以下是腾讯云相关产品和产品介绍链接地址：

腾讯云函数计算（云原生）：https://cloud.tencent.com/product/scf
腾讯云数据库（数据库）：https://cloud.tencent.com/product/cdb
腾讯云服务器（服务器运维）：https://cloud.tencent.com/product/cvm
腾讯云CDN（网络通信）：https://cloud.tencent.com/product/cdn
腾讯云安全产品（网络安全）：https://cloud.tencent.com/product/saf
腾讯云音视频处理（音视频、多媒体处理）：https://cloud.tencent.com/product/mps
腾讯云人工智能（人工智能）：https://cloud.tencent.com/product/ai
腾讯云物联网（物联网）：https://cloud.tencent.com/product/iotexplorer
腾讯云移动开发（移动开发）：https://cloud.tencent.com/product/mob
腾讯云对象存储（存储）：https://cloud.tencent.com/product/cos
腾讯云区块链（区块链）：https://cloud.tencent.com/product/baas
腾讯云虚拟专用网络（VPC）：https://cloud.tencent.com/product/vpc
腾讯云容器服务（容器）：https://cloud.tencent.com/product/ccs
腾讯云云原生应用引擎（云原生）：https://cloud.tencent.com/product/tke

页面内容是否对你有帮助？

有帮助

没帮助

相关·内容

jQuery点击按钮，生成input输入框

需求，点击添加按钮，生成input输入框，如果上一个输入框为空，则弹出提示框提示，若不为空，则生成一行input框。 <script src="https://cdn.staticfile.org/twitter-bootstrap/3.3.7

6.7K1 0

jquery动态生成input，并且限制生成个数

写一个小的demo,具体是点击添加按钮，会自动生成input输入框，并且根据要求限制生成的input输入框的个数。大致效果如下所示： ? 原文作者：祈澈姑娘技术博客：https://www.jianshu.com/u/05f416aefbe1 90后前端妹子，爱编程，爱运营，文艺与代码齐飞，魅力与智慧共存的程序媛一枚

3.9K2 0

cssjshtml jquery向动态生成的元素添加事件

定义和用法 delegate() 方法为指定的元素（属于被选元素的子元素）添加一个或多个事件处理程序，并规定当这些事件发生时运行的函数。...使用 delegate() 方法的事件处理程序适用于当前或未来的元素（比如由脚本创建的新元素）。...规定要附加事件处理程序的一个或多个子元素。 event 必需。规定附加到元素的一个或多个事件。由空格分隔多个事件值。必须是有效的事件。 data 可选。规定传递到函数的额外数据。...p.over { background: #ccc; } span { color: red; } Click me!

3.1K1 0

jquery点击删除按钮,删除当前的div

现在有多行div，共用一个删除事件，点击删除的时候，会把页面所有的div全都删掉了，但是我只需要点击哪一行div里面的删除按钮，就删除哪一行，其实很简单，只需要写一个this事件即可。 ?...cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css"> // 删除按钮事件...body> 原文作者：祈澈姑娘技术博客：https://www.jianshu.com/u/05f416aefbe1 90后前端妹子，爱编程，爱运营，文艺与代码齐飞，魅力与智慧共存的程序媛一枚

5.2K3 0

如何解决jQuery Validation针对动态添加的表单无法工作的问题？

为了充分利用ASP.NET MVC在服务端呈现HTML的能力，在《利用动态注入HTML的方式来设计复杂页面》一文中介绍了，通过Ajax调用获取HTML来呈现复杂页面中某一部分界面的解决方案。...我们知道ASP.NET MVC默认集成了jQuery Validation，但是对于通过JavaScript动态添加的表单，客户端验证默认情况下是失效的。...="updateContact"> 7: <script type="text/javascript" src="@Url.Content("~/Assets/js/jquery...，运行程序后点击Save按钮提交表单后，输入的数据并不会被验证（客户端验证）。...为了解决这个问题，可以在动态注入表单之后按照如下的方式调用$.validator.unobtrusive.parse()对表单元素进行重新解析。

1.9K9 0

jQuery动态生成input填写时间值并且提交给后端

今天写的一个demo，关于jQuery动态生成input填写时间值并且提交给后端。需求：1：点击新增按钮的时候，会无限动态生成input输入框，可以输入不同的时间。...2：点击提交按钮的时候，将生成的这些时间提交到后端。参考代码如下所示：动态生成时间并且提交给后端...

1.9K3 0

jQuery实现动态添加和删除（点击按钮添加在页面添加和删除元素）

1：点击添加按钮弹出弹框，form表单可以填写相关的信息 2：点击保存按钮，相关信息会显示在界面的列表里 ? 3：鼠标滑动界面列表的标签，会出现删除按钮的图标，点击删除成功 ?...4：代码如下，可以根据需要自行修改（可能会有多余的代码，但是不会影响效果） <script src="https://cdn.staticfile.org/twitter-bootstrap/3.3.7

7.2K2 0

jQuery Mobile的学习时间botton按钮的事件学习

最近在学习jquery mobile开发，使用的button，绑定事件，和大家一起学习，一起分享！直接上代码： <div data-role="...throttledresize 启用可标记 #hash 历史记录 updatelayout 由<em>动态</em>显示/隐藏内容<em>的</em> <em>jQuery</em> Mobile 组件触发。

1.6K2 0

动态生成表格、隐藏表格、选中删除任意行、jquery、输入验证

PS：游戏公司后台开发，工作模式：996。于是写博客这事也荒废了.... 想想还是写一点吧。呵呵，请不要笑话我注释写这么多，习惯了，我上班写代码都是有注释的。...我建两个相似的表是为了，给后台使用人员显示所操作的数据，同时方便把开发人员真正要操作的数据传到对应Action中，隐藏开发人员传参用的表。...color:red;border-left:0px;border-top:0px;border-right:0px;border-bottom:1px;" id="choseNotice"/> 动态生成表格...、选中删除任意行： //添加按钮点击事件 function addProp() { //正则：非零和非零开头的数字：^([1-9][0-9]*)$ var...if($("#proptdid_"+propSid+"").html()==undefined) { //动态生成tr var tr = "<tr id='proptrid

2.6K6 0

jQuery Mobile(jqm)按钮的隐藏和显示,包括a标签,圆角和非圆角按钮

于是各种HTML5的框架都出来了。由于对于jquery的熟悉，jquery mobile 为多数人选择学习的对象。我也是众多追求者之一。最近一直在开发jQuery Mobile的相关应用。.../styles.css">--> <script src="http://code.<em>jquery</em>.com...减去ui-first-child样式 $('#btn2').parent("div").removeClass('ui-first-child'); }); //a5标签的onclick...更详细的学习资料，请点击下载：http://download.csdn.net/download/xmt1139057136/7447463

3.5K3 0

一键点击链接(按钮)下载js(jquery.qrcode)生成的二维码图片

上周日最得意的事情莫过于搞定了jquery.qrcode生成的二维码图片一键下载。...有时候觉得已经生成了二维码图片，直接打印就行了，但是用户总有新需求诞生，于是用户说每次保存二维码的图片，都需要右键点击，然后另存为，能不能直接一个按钮点一下就下载这个二维码呢？...能不能直接把二维码图片的名称也在保存的时候自动生成？我的上帝呀，你可以知道你的这么一个小小的要求，我需要折腾多久吗？没错，困扰了1周，最后思考了半天，弄了2个小时程序，才实现了。...中间走了不少弯路，期间参考了《点击按钮保存网页中指定的图片，利用js实现》，可惜jquery.qrcode所生成的图片（我用的是image的渲染方式，因为只有这种方式打印的时候能被直接默认打印出来，canvas...console.log(img); $("#downloadqrcode").attr("href",img); }); 这里为什么不用$(document).ready，是因为jquery.qrcode

4.7K2 0

按钮生成器！要的就是效率！

大家好，我是前端实验室的大师兄！按钮是我们页面开发中必不可少的一部分。在平常开发中，我们常常一遍又一遍的重复写着各种各样的按钮样式。这些简单，但机械重复的工作是否影响到你的工作效率了呢？...今天，大师兄就为大家推荐一个按钮生成的网站。100+款按钮样式和响应方式供你挑选！准备好了吗？一起来看下吧！ 3D款平面3D效果的按钮。...阴影边框按钮带点阴影边框，在大师兄的项目中算是基本需求了。因为生硬的边框总会缺乏点柔和的美感。拷贝个代码来看看。...各种hover状态浮光掠影的效果镂空效果滑动效果增加其他显示其他按钮的样式和交互功能，对大家来说都是很简单的操作。但重复的编写这些代码会浪费些许时间。...本文分享了各种常用的各种按钮形式，对于有自定义按钮需求的小伙伴可以作参考。网站地址 https://markodenic.com/tools/buttons-generator/

4982 0

好用的jQuery工作进度条

上周我在做OA里面的任务管理时，通过比较jQuery UI自带的[URL=http://jqueryui.com/progressbar]progress bar[/URL]还有jQuery easyui...中的[URL=http://www.jeasyui.com/documentation/progressbar.php]progress bar[/URL]，发现都不太符合我的需求，最后找到一个特别简单的实现...，只需几行代码即可，读懂英文的看这里[URL=http://workshop.rs/2012/12/animated-progress-bar-in-4-lines-of-jquery/]ANIMATED...PROGRESS BAR IN 4 LINES OF JQUERY[/URL]，也可以看GitHub上的网址：[URL=https://github.com/kopipejst/progressbar...，我不喜欢把javascript的调用放在body中，于是放在jQuery的ready事件中，另外我这里的lblRateOfProgress在页面前端做一个display:none的隐藏。

8832 0

jquery 用于操作动态元素的delegateon方法

delegate() 方法的事件处理程序适用于当前或未来的元素（比如由脚本创建的新元素）。...在做项目中有很多由ajax动态生成的html标签，jquery对这些标签不会响应(selector).click(function.....查看资料有的推荐使用live方法，但live在jQuery1.7中就不再建议使用，在1.9中就给删除了，改用on方法取代live方法。...jQuery官方网站声称下面三行代码是等价的 (“.btn”).live(“click”, function(){ alert(“Goodbye!”)...; }); // jQuery 1.4.3+ 这里要特别注意：$(“.jk_table”)这个对应的元素必须不是动态生成的。版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。

2.9K2 0

动态生成html当中的组件

4.动态生成html当中的组件有时html里的字数太多，而且有一定的规律时，我们就可以用如下的方法产生动态的内容。

1.9K0 0

生成二维码的 jQuery 插件：jquery.qrcode.js

jquery.qrcode.js 是一个纯浏览器生成 QRcode 的 jQuery 插件，它使用非常简单，生成的 QRcode 无需下载图片，并且不依赖第三方服务，比如最近 Google 服务在国内访问不稳就造成我好几个网站的...加载 jQuery 和 jquery.qrcode.js： <script type='text/javascript' src='http://cdn.staticfile.org/<em>jquery</em>/2.1.1...创建一个用于包含 QRcode 图片<em>的</em> DOM 元素，比如 div： 3....然后通过下面代码<em>生成</em> QRcode： <em>jQuery</em>('#qrcode').qrcode("http://blog.wpjam.com"); 4....默认生成的二维码大小是 256x256，当然可以自定义大小： jQuery('#qrcode').qrcode({width: 64,height: 64,text: "http://blog.wpjam.com

1.3K2 0

Android项目实战（四十）：在线生成按钮Shape的网站

Android Button Make 　　　右侧设置按钮的属性，可以即时看到效果，并即时生成对应的.xml 代码，非常高效（当然熟练的话自己手写代码更快）

1K10 0

点击提交按钮，提交所有生成的input参数

今天晚上加班，又写了一些很基础的东西，感觉到自己的js基础还是很差的，对于数据结构上的理解还差了很多火候。...这里主要实现了一些小功能，点击添加按钮的时候，自动生成input框，并且设定限制个数，最多不超过3个，当class字段超过3个的时候，就不继续往下执行程序了。...然后点击提交按钮的时候，把input框里面所有的值提交到后端，可以在控制台打印出来查看所提交的字段。 ? test <span style="

1.8K1 0

jQuery 实现富文本的标题自动生成目录

参考文档 JQuery 实现自动生成二级目录 JQuery 点击事件回到页面顶部效果配置步骤 content 内容的标题要固定某个号，如：h2 设置 content 内容 div 的 id 属性，如：...id="yzq-blog-content" 实现的 js 代码只生成一级目录，指定 h2（效果）： <script language="javascript" type="text/javascript...h2');// 这里<em>的</em> h2, 换成内容页面对应<em>的</em>标题号数 (h1 h2 h3) if (<em>jquery</em>_h3_list.length > 0) { var content...() { var <em>jquery</em>_h3_list = $('#yzq-blog-content h2');// 这里<em>的</em> h2, 换成内容页面对应<em>的</em>标题号数 (h1 h2 h3)..._list[i]).text() + ''; // h3 <em>生成</em>目录 var <em>jquery</em>_h4_list = $(<em>jquery</em>_h3

5791 0

利用 memos 生成的在线动态列表

memos 是一个具有知识管理和社交功能的开源自托管备忘录中心。...Github地址：https://github.com/usememos/memos 可以用它本身提供的 api，然后结合静态博客，做成一个在线的动态列表，类似于朋友圈功能。...接口 url 有固定的格式，openId 是每个用户自动生成的。其次我又写了两个方法，一个是时间戳转成正常时间格式，一个是利用正则删去内容中多余的标签。...将下面代码复制到你想显示的页面编辑，只需修改 openId，提供了一个基础的样式，如果有其他优化方案，欢迎指出。...openId + "&tag=说说", type: "get", dataType: "json", success: function (data) { // 生成数组

2482 0

点击加载更多

扫码

添加站长进交流群

领取专属 10元无门槛券

手把手带您无忧上云

扫码加入开发者社群

相关资讯

热门标签

活动推荐

运营活动

活动名称

广告关闭