jquery绑定未来元素

最新推荐文章于 2022-09-23 20:20:30 发布
最新推荐文章于 2022-09-23 20:20:30 发布
阅读量497 收藏
点赞数
分类专栏： js

/**一般习惯用jquery后就感觉特别好用，不想写原生了。那么当我们要对未来的元素进行时间绑定时jquery要如何进行

对未来元素得绑定呢？*/

 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<ul id="uls"></ul>
<script src="../js/jquery-3.2.1.min.js"></script>  //引入自己的jquery
<script>
    // //#username原先就有，li是未来元素
    // $("#username").on("click","li",function(){
    //
    // })

    //第一种
    $("#uls").html("<li class='one'>你就呵呵</li>");
    $("#uls").on("click","li",function(){
        alert("li的点击时间被执行了");
    })
    //第二种
     $("#uls").delegate("li","click",function(){
           alert("li的点击时间被执行了");
   });


</script>
</body>
</html>

 

小皮皮不皮
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
jQuery中对未来的元素绑定事件用bind、live or on
12-03
对未来的元素绑定事件不能用bind， 1、可以用live代替，但是要注意jquery的版本,根据官方文档，从1.7开始就不推荐live和delegate了，1.9里就去掉live了。 2、推荐用on代替(注：1.7及以上的版本才支持)。用法：on(events,[selector],[data],fn) 代码如下: //放在$(function(){})里才有效 $[removed](“click”, “#testDiv”, function(){ //此处的$(this)指$( “#testDiv”)，而非$(document) }); 3、 当只想为每一个匹配元素的特定事件（像
JQ 未来元素的绑定
u014685642的博客
02-24 134
经常粘贴复制这些事件，发现很多网站代码看似一致，实际有区别，不被识别。 做些记录，以免不时之需 1.移入 $(document).on("mouseover","#id",function(){}) 2.移出 $(document).on("mouseleave","#id",function(){}) 3.点击 $(document).on("click","#id",function(){}) 4.按下按键（过滤） $('#id').on('keyp...
Jquery绑定未来元素
weixin_30394633的博客
06-16 93
对未来元素绑定，不能用bind。 1、可以用live代替，但是要注意jQuery的版本,根据官方文档，从1.7开始就不推荐live和delegate了，1.9里就去掉live了。 2、不支持live之后什么代替live呢，是on，用法如下所示： //放在$(function(){})里才有效$(document).on("click", "#testDiv", function(){/...
jquery对未来元素的操作
qq_36575363的博客
03-01 599
对未来元素绑定，不能用bind。 1、可以用live代替，但是要注意jquery的版本,根据官方文档，从1.7开始就不推荐live和delegate了，1.9里就去掉live了。 2、不支持live之后什么代替live呢，是on，用法如下所示： //放在$(function(){})里才有效 $(document).on("click", "#testDiv", function(){ //...
js & jQuery 绑定未来的元素
sinat_36539161的博客
08-16 1032
最近，一个同事跟我求助，说在页面点击按钮，向一个 div 添加 select 标签，根据 select 选中项取值，但取不到！如下： &lt;button id="btn"&gt;btn&lt;/button&gt; &lt;div id="box"&gt;&lt;/div&gt; 怎么办？ 我们先来做几个测试：  1、点击 button，向 div 里添加多个未来按钮，点击某个未来按...
jQuery实现为动态添加的元素绑定事件实例分析
10-18
3. **`on()`** 方法是jQuery 1.7引入的，现在是绑定动态元素事件的标准方式，它支持当前和未来的元素，包括那些由脚本创建的。`on()` 方法的语法如下： ```javascript $(selector).on(event, childSelector, data, ...
jQuery事件绑定和委托实例
10-25
`live()` 方法允许事件处理程序处理未来添加到DOM中的匹配元素的事件。它使用事件冒泡原理来实现，但已经被`on()`方法取代，因为`on()`更灵活且性能更好。基本用法如下： ```javascript $(selector).live(event, ...
jQuery事件绑定方法学习总结(推荐)
10-21
jQuery事件绑定方法是jQuery库中用于处理用户交互和DOM元素动态行为的核心机制。本文将深入探讨其中的几个关键方法：on(), bind(), delegate(), 和 live()，并对比它们的使用场景和优缺点。 首先，`bind()`是jQuery...
关于Jquery中的事件绑定总结
10-21
在jQuery中，事件绑定是操作DOM元素交互的关键技术。本文将深入探讨四种主要的事件绑定方法：`bind()`、`live()`、`delegate()`以及`on()`，它们各自的特点、用法以及适用场景。 首先，`bind()`是jQuery早期版本中...
jQuery如何获取动态添加的元素
01-19
一、问题描述 　　用jQuery的append()方法动态添加了一段html代码之后，发现在为新添加的元素绑定click事件时无法获取该新元素。 二、解决方法 　　度娘推荐的方法基本是用live()方法 　　live()的官方定义和用法: 　　live() 方法为被选元素附加一个或多个事件处理程序，并规定当这些事件发生时运行的函数。通过 live() 方法附加的事件处理程序适用于匹配选择器的当前及未来的元素（比如由脚本创建的新元素）。 　　live()的详细使用方法可以查看jQuery live() 　live()和bind()的区别就是live不仅可以给页面中现有的元素绑定事
jquery 绑定未来元素事件
lixiaonaaa的博客
03-16 1062
1，用js动态生成dom元素很常见，那么给这种动态生成的元素如何绑定事件呢？首先排除click，是肯定不好用的。下面来介绍集中方法。 1) 直接行内绑定 <div onClick="doSomething()"></div> 2) delegate 先看下官方解释 $('body').delegate('div','click',function(){ // do something…… }) 3）on on绑定结合了click和delegate二者的功
jQuery事件2-第6次课-给未来的元素绑事件-事件对象-JS盒模型-附案例、任务
商务合作 / 项目定制开发 / 前端一对一培训、答疑
09-22 311
本次课涉及内容有： 1、官方推荐的绑定事件的方式on关键字 2、事件对象event 3、JQ的滚动条事件 4、JQ的盒模型表示
jq如何处理未来元素？
liuzhaoyun的博客
08-22 2844
    未来元素，在我的理解里就是目前没有，但发了ajax后，这个元素就有了，这就是“未来元素”。有时我们需要对未来元素进行操作，比如以下的业务场景。     我从下拉框中，选择“省份”后，下面多出来选择“州/市”的下拉框，这个时候，我需要点击州/市这个下拉框，我希望出现“区/县”的信息。     这个时候，我们就用到未来元素的操作了。     代码格式如下： $(document).o...
为未来元素绑定事件(JavaScript和jquery两种方法对比)
LPLIFE的博客
05-25 3961
小白 ~_~!!  日常打酱油  一般我们为已经存在的元素绑定事件,那么直接获取这个元素的id,直接绑定上去就可以了. 但当这个元素不存在,将会我们又会添加进去的时候,直接获取目标元素id绑定事件就会对未来新添加的元素失效了!!.  也就是你后来新添加这个元素,是无法被触发的,事件根本就没有被绑定上去.但是还是有解决办法滴.(JavaScript)解决办法: 1. 通过它的父元素 2. 借助事件属...
jquery 未来元素绑定事件.on()
cc蒲公英的博客
01-03 2696
live() —— jquery1.8版本之后就不建议使用了 on() —— 适用于当前及未来的元素（比如由脚本创建的新元素） 正确写法:$("#addressOpera").on("click","ul li",function(){ $(this).css("border","5px solid #000"); }); //下面这样写就是错的了，一定要把动态添加的元素放到on()
JQuery为未来元素绑定事件
freeman_hyf的博客
11-15 272
对于用JS生成的元素，原先绑定的方法会没有效果。 <!DOCTYPE html> <html> <meta charset="UTF-8" /> <script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script> <style> .a{ float:left; margin-left:10px; widt
jquery 为未来元素绑定事件
lfkabb的博客
02-14 2124
今天要讲的是jquery 为未来元素绑定事件，做了一个页面，因为元素都是通过ajax请求得来渲染的，故称未来元素。之前没有进行特殊操作，就当一般元素来写事件，但却没有效果。代码如下： html 主要部分： &lt;div class="box"&gt;&lt;/div&gt; &lt;script id="t1" type="text/...
jquery-给未来元素添加事件
weixin_67993323的博客
09-23 1290
delegate()
jquery动态绑定点击事件
最新发布
09-21
这个方法可以为现有的元素和未来添加到文档中的元素绑定事件处理程序。 下面是一个示例，展示如何动态绑定点击事件： ```javascript $(document).on("click", "#myElement", function(){ // 在此处放置你的点击...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值