首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

jQuery的 delegate问题

支持为动态生成的标签元素绑定事件也许就live和delegate了吧,不过新版本已经不支持live了,只有delegate delegate真的比较特殊呀,不同于其他事件绑定的风格。...使用 delegate() 方法的事件处理程序适用于当前或未来的元素(比如由脚本创建的新元素)。...规定要附加事件处理程序的一个或多个子元素。 event 必需。规定附加到元素的一个或多个事件。 由空格分隔多个事件值。必须是有效的事件。 data 可选。规定传递到函数的额外数据。...javascript"> $(document).ready(function(){ $("div").delegate("button","click",function(){ $("p").slideToggle...我老写成了 $(document).ready(function(){ $("div").delegate($("button"),"click",function(){ $("p").slideToggle

69710
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    jquery事件delegate()方法用法详解

    我们先看官方是怎么说delegate()方法,delegate() 方法为指定的元素(属于被选元素的子元素)添加一个或多个事件处理程序,并规定当这些事件发生时运行的函数,使用 delegate() 方法的事件处理程序适用于当前或未来的元素...(比如由脚本创建的新元素)。...规定要附加事件处理程序的一个或多个子元素。 event 必需。规定附加到元素的一个或多个事件。 由空格分隔多个事件值。必须是有效的事件。 data 可选。规定传递到函数的额外数据。...规定当事件发生时运行的函数。...的函数是被某一类型的共同父元素调用 实例: 当点击鼠标时,隐藏或显示 p 元素: $("div").delegate("button","click",function(){ $("p").slideToggle

    72530

    JQuery选择器

    javascript” src=“jQuery.js”> 引用Jquery的两种方式 jQuery常用的事件...当元素改变时运行脚本 submit:当提交表单时运行脚本 keydown:当按下按键时运行脚本 keypress:当按下并松开按键时运行脚本 keyup:当松开按键时运行脚本 click:当单击鼠标时运行脚本...当鼠标指针移动时运行脚本 mouseout:当鼠标指针移出元素时运行脚本 mouseover:当鼠标指针移至元素之上时运行脚本 mouseup:当松开鼠标按钮时运行脚本 abort:当发生中止事件时运行脚本...(selector).slideDown() – 通过调整高度来滑动显示被选元素 (selector).slideToggle() – 对被选元素进行滑动隐藏和滑动显示的切换 (selector).slideUp...(selector).eq() – 指定索引的新元素。 (selector).get() – 获得由选择器指定的 DOM 元素。

    7.4K10

    前端开发JS——jQuery常用方法

    1、jQuery鼠标事件之click与dbclick事件 click方法用于监听用户单击操作,dbclick方法用于监听用户双击操作,这两个方法用法及其类似,所以这只介绍click事件,只有单击释放后才生效...(eventObject)) click的参数是函数(回调函数),单击会执行函数里的操作,如果里面含有this,this指向触发事件元素的对象 方法三:$ele.click([eventData], handler...2、jQuery鼠标事件之mousedown与mouseup事件 mousedown方法用于监听用户鼠标按下操作,只有鼠标按下后才生效,mouseup方法用于监听用户鼠标松开操作,只有鼠标松开后才生效...4、jQuery鼠标事件之mouseover与mouseout事件 mouseover方法用于监听用户鼠标移入操作,只有鼠标移入区域内后才生效,mouseout方法用于监听用户鼠标移出操作,只有鼠标移除区域后才生效...因为动画是异步的,所以要在动画之后执行某些操作就必须要写到回调函数里面 4、jQuery中上卷下拉切换slideToggle方法(改变元素的高度) slideToggle 方法是上述两个方法的切换 $ele.slideToggle

    5K20

    jquery 事件绑定及取消 bind live delegate on one区别 (超详细且通俗易懂)

    function(){ alert(123)}); $("button").click(function(){ $("p").unbind("click",alertMe); //将p标签单击调用...和bind方法有两个不同 1.没有map不能单独规定事件 2.live方法绑定的事件会应用于当前现有的元素以及未来元素,也就是事件委托机制,把节点的处理统一委托给了根节点document,所以后面动态添加的新节点同样会有相同的事件...$("button").live("click",function(){ $("p").slideToggle(); //给所有的p节点添加了收缩事件,包括动态添加的新的p标签 }); 注:使用live...).slideToggle(); }); $("button").click(function(){ $("这是一个新段落。...$(selector).on(event,childSelector,data,function)   和delegate书写顺序不同 这个on要先写事件 event 必需。

    2.4K21

    jquery对象和dom对象的相互转换

    $("#msg").click(fn);   //为id为msg的元素单击事件添加函数 同样blur,focus,select,submit事件都可以有着两种调用方法 5、集合处理功能 对于jquery...=['#f00','#0f0','#00f'][i]}) //为三个不同的p元素单击事件分别设定不同的处理 jQuery中几个自定义的事件: (1)hover(fn1,fn2):一个模仿悬停事件(鼠标移动到一个对象上面...p元素上的所有事件 $("p").unbind("click")   //删除所有p元素上的单击事件 10、几个实用特效功能 其中toggle()和slidetoggle()方法提供了状态切换功能。...如toggle()方法包括了hide()和show()方法。 slideToggle()方法包括了slideDown()和slideUp方法。...可用于近似地迭代对象和数组 (代替循环)。

    3.3K40

    Jquery 使用技巧总结

    jQuery适合于设计师、开发者以及那些还好者,同样适合用于商业开发,可以说jQuery适合任何JavaScript应用的地方,可用于不同的Web应用程序中。...$("#msg").click(fn); //为id为msg的元素单击事件添加函数 同样blur,focus,select,submit事件都可以有着两种调用方法 5、集合处理功能...=['#f00','#0f0','#00f']}) //为三个不同的p元素单击事件分别设定不同的处理 jQuery中几个自定义的事件: (1)hover(fn1,fn2):一个模仿悬停事件(鼠标移动到一个对象上面及移出这个对象...//删除所有p元素上的所有事件 $("p").unbind("click") //删除所有p元素上的单击事件 10、几个实用特效功能 其中toggle()和slidetoggle...如toggle()方法包括了hide()和show()方法。 slideToggle()方法包括了slideDown()和slideUp方法。

    2.9K20

    jQuery (二)

    使用jQuery处理事件 事件处理 一个栗子,单击p时背景变成灰色 由于es6的箭头函数不支持this的绑定,所以无法使用箭头函数,只能使用匿名函数 html <!...$('a').unbind('.myMod'); // 取消同时绑定在ns1和ns2命名空间下的单击处理程序 $('a').unbind('click.ns1.ns2') 使用命名空间达到模块化的目的...; // 触发没有命名空间的单击处理程序 或者如下 // 单击一将会触发二上的事件 $('#button1').click((e) => {$('#button2').trigger('button2'...为向上 slideToggle() 使用向上滑动和向下滑动,切换元素的可见性。...ajax还会在请求的时候,触发相应的事件 这个用于在请求某些图片的时候,在图片仍旧继续下载的时候,使用相应的时间,提示出图片正在加载中 例如 $('#loading_animation').bind(

    9.3K30

    jquery 使用方法

    创建新元素的方法非常简单,只要把新元素直接传入jQuery的构造函数就行了: 1 $('Hello'); 2 $('new list item...2 .change() 表单元素的值发生变化 3 .click() 鼠标单击 4 .dblclick() 鼠标双击 5 .focus() 表单元素获得焦点 6 .focusin(...使用.bind()可以更灵活地控制事件,比如为多个事件绑定同一个函数: 1 $('input').bind( 2 'click change', //同时绑定click和change事件 3 function...e){ 2 alert(e.type); //"click" 3 }); 这个事件对象有一些很有用的属性和方法: 1 event.pageX 事件发生时,鼠标距离网页左上角的水平距离 3...) 淡出 5 .fadeTo() 调整透明度 6 .hide() 隐藏元素 7 .show() 显示元素 8 .slideDown() 向下展开 9 .slideUp() 向上卷起 10 .slideToggle

    1.6K10

    【Java 进阶篇】JavaScript DOM Document对象详解

    最后,我们通过appendChild方法将新元素添加到容器中。 这个过程可以动态地向文档中添加内容,非常适用于需要根据用户操作动态生成元素的情况,比如添加新的列表项或评论。...DOM事件 Document对象也可以用于处理DOM事件。事件是与HTML元素相关的用户行为,例如单击、鼠标悬停、键盘输入等。JavaScript允许您捕获这些事件并执行相应的操作。...以下是一些常见的DOM事件: click: 当元素被单击时触发。 mouseover: 鼠标悬停在元素上时触发。 keydown: 键盘按键被按下时触发。 submit: 表单被提交时触发。...这样的事件处理程序允许您在用户与网页进行交互时执行特定的JavaScript代码,从而实现各种互动和反馈。 DOM样式 Document对象还允许您访问和修改元素的样式。...通过Document对象,您可以获取元素、创建新元素、写入文本、处理事件以及修改元素的样式。这些功能使JavaScript能够与网页内容互动,实现动态和交互性的网页。

    35420
    领券