JQuery的delegate事件参数说明[通俗易懂]

JQuery的delegate事件参数说明[通俗易懂]JQuery的delegate事件: delegate()方法为指定的元素(属于被选元素的子元素)添加一个或多个事件处理程序,并规定当这些事件发生时运行的函数。 使用delegate()方法的事件处理程序适用于当前或未来的元素(比如由脚本创建的新元素)。 $(selector).delegate(childSelector,event,dat

大家好,又见面了,我是你们的朋友全栈君。如果您正在找激活码,请点击查看最新教程,关注关注公众号 “全栈程序员社区” 获取激活教程,可能之前旧版本教程已经失效.最新Idea2022.1教程亲测有效,一键激活。

Jetbrains全系列IDE稳定放心使用

JQuery的delegate事件:

 

delegate() 方法为指定的元素(属于被选元素的子元素)添加一个或多个事件处理程序,并规定当这些事件发生时运行的函数。

 

使用 delegate() 方法的事件处理程序适用于当前或未来的元素(比如由脚本创建的新元素)。

 

$(selector
).delegate(childSelector
,event
,data
,function
)

 

注意了 :

 

delegate是用在父子元素之间的一个事件,意思就是说childselector一定要是selector的子元素。

 

如:

 

<html>
<head>
<script type=”text/javascript” src=”/jquery/jquery.js”></script>
<script type=”text/javascript”>
$(document).ready(function(){

  $(“div “).delegate(“p “,”click”,function(){

    $(this).slideToggle();
  });
  $(“button”).click(function(){

    $(“<p>这是一个新段落。</p>”).insertAfter(“button”);
  });
});
</script>
</head>
<body>
<div style=”background-color:yellow”>
<p>这是一个段落。</p>
<p>请点击任意一个 p 元素,它会消失。包括本段落。</p>
<button>在本按钮后面插入一个新的 p 元素</button>
</div>
 
<p><b>注释:</b>通过使用 delegate() 方法,而不是 live(),只有 div 元素中的 p 元素会受到影响。</p>
</body>
</html>

 

 

如果子元素不是标签元素而是类元素或者ID元素,怎么使用选择器选择呢?

 

<html>
<head>
<script type=”text/javascript” src=”/jquery/jquery.js”></script>
<script type=”text/javascript”>
$(document).ready(function(){

  $(“div”).delegate(“.jean”,”click”,function(){

    $(this).slideToggle();
  });
 
  $(“button”).click(function(){

    $(“<p>这是一个新段落。</p>”).insertAfter(“button”);
  });
});
</script>
</head>
<body>
<div style=”background-color:yellow”>
<p class=”jean”>这是一个段落。</p> 
<p >请点击任意一个 p 元素,它会消失。包括本段落。</p>
<button>在本按钮后面插入一个新的 p 元素</button>
</div>
<p><b>注释:</b>通过使用 delegate() 方法,而不是 live(),只有 div 元素中的 p 元素会受到影响。</p>
</body>
</html>

 

childselector直接写成选择器的样子就好了,如上面:.jean 或者如果是ID的话就是 #jean,千万不要写成$(“.jean”)哦

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

发布者:全栈程序员-用户IM,转载请注明出处:https://javaforall.cn/179625.html原文链接:https://javaforall.cn

【正版授权,激活自己账号】: Jetbrains全家桶Ide使用,1年售后保障,每天仅需1毛

【官方授权 正版激活】: 官方授权 正版激活 支持Jetbrains家族下所有IDE 使用个人JB账号...

(0)


相关推荐

  • pycharm远程调试python_pycharm调试教程

    pycharm远程调试python_pycharm调试教程pycharm远程开发与调试0.为pycharm添加远程服务器配置如果你已经为该服务器配置过远程服务器,可忽略此步骤。打开pycharm,tools-&amp;amp;amp;amp;gt;Deployment-&amp;amp;amp;amp;gt;Configuration,在左边栏点“+“号添加远程服务器。右边配置如下图,只需要配置connection,注意”Visibleonlyforthisproject”的勾去掉!…

  • Python assert 断言函数「建议收藏」

    使用assert断言是学习python一个非常好的习惯,pythonassert断言句语格式及用法很简单。在没完善一个程序之前,我们不知道程序在哪里会出错,与其让它在运行最崩溃,不如在出现错误条件时就崩溃,这时候就需要assert断言的帮助。本文主要是讲assert断言的基础知识。pythonassert断言的作用pythonassert断言是声明其布尔值必须为真的判定,如果发生异

  • ASP.NET MVC 5高级编程 (pdf书)「建议收藏」

    ASP.NET MVC 5高级编程 (pdf书)「建议收藏」链接:https://pan.baidu.com/s/1o7WaazYwihrgYstxak3olQ密码:vc78

  • Uniapp中onShow()的应用

    Uniapp中onShow()的应用遇到问题:在使用一些变量进行判断时,用完一次开始下一次判断时,结果会跟前一次一样,比如门禁中第一个房子打开后,切换到另外的房子,结果返回结果跟第一个房子一样。原因分析:用于使用了相同的变量进行判断,然而在第一次执行完后,并没有把变量重新初始化,导致页面在第二次加载的时候,显示的结果跟第一次一样。解决方法:在onShow()里面,通过一些参数,判断在切换页面的时候,有没有切换房屋,如果房屋没变的话,切换页面时就不用重新初始化变量。如果房屋改变了,就把变量重新初始化。总结:.

  • Windows Mobile 6 Professional SDK 「建议收藏」

    Windows Mobile 6 Professional SDK 「建议收藏」Lotyong的WindowsMobile6ProfessionalSDKhttp://download.microsoft.com/download/f/2/3/f232f773-7edc-4300-be07-d3b76a5b3a91/Windows%20Mobile%206%20Professional%20SDK.msiWindowsMobile6Professio

  • 心脏出血漏洞利用「建议收藏」

    心脏出血漏洞利用「建议收藏」0x0引言~心脏出血(英语:Heartbleed),也简称为心血漏洞,是一个出现在加密程序库OpenSSL的安全漏洞,该程序库广泛用于实现互联网的传输层安全(TLS)协议。它于2012年被引入了软件中,2014年4月首次向公众披露。只要使用的是存在缺陷的OpenSSL实例,无论是服务器还是客户端,都可能因此而受到攻击。此问题的原因是在实现TLS的心跳扩展时没有对输入进行适当验证(缺少边界检查),…

发表回复

您的电子邮箱地址不会被公开。

关注全栈程序员社区公众号