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)


相关推荐

  • Android源码学习「建议收藏」

    Android源码学习「建议收藏」作为一名程序员,肯定不仅仅限于使用API文档,因为浮于表面是远远不够的。进阶学习的阶段,需要我们保持一颗好奇的心,深入阅读Android源码,学习优秀的代码风格和设计思想,知其然并且知其所以然。引用Google的一张框架图:Applications层,和用户直接交互的就是这些应用程序,它们都是用Java开发的。 JavaFramework层,这一层大部分用Java语言编写。它是An…

  • 大话无线通讯基础之:WIFI和5G信道划分

    大话无线通讯基础之:WIFI和5G信道划分目前主流的无线WIFI网络设备802.11a/b/g/n/ac:各种协议的数据传输率:80211.a协议支持的数据传输率:6、9、12、18、24、36、48和54Mbps80211.b协议支持的数据传输率:1、2、5.5和11Mbps80211.g协议支持的数据传输率:6、9、12、18、24、36、48和54Mbps;可以降级到1、2、5.5…

  • pycharm无法使用中文输入法_游戏内无法输入中文

    pycharm无法使用中文输入法_游戏内无法输入中文第一步:点击【File】—【Setting】—【Editor】—【FileEncoding】页面,设置global和projectencoding为UTF-8,然后点击应用。第二步:点击【File】—【Setting】—【Editor】—【FileandCodeTemplates】,点击右边的【pythonscript】,在编辑框中输入:#-*-codi

  • 美团js面试题

    美团js面试题转载自:http://blog.csdn.net/qq_27682041/article/details/76408681该题难度系数:★★★考查的技术点:1).作用域与作用域链 2).变量查找这题分为两小题,我们先看第一题:[javascript] viewplain copyvar fn = funct

  • Tomcat下载安装并部署到IDEA的教程(附带idea两种热部署设置方法)

    这篇文章主要介绍了Tomcat下载安装并部署到IDEA的教程(附带idea两种热部署设置方法),本文图文并茂给大家介绍的非常详细,具有一定的参考借鉴价值,需要的朋友可以参考下

  • 六十四卦详细解释_六十四卦断事

    六十四卦详细解释_六十四卦断事文章目录第1卦 乾为天(乾卦) 刚健中正 上上卦第2卦 坤为地(坤卦) 柔顺伸展 上上卦第3卦 水雷屯(屯卦) 起始维艰 下下卦第4卦 山水蒙(蒙卦) 启蒙奋发 中下卦第5卦 水天需(需卦) 守正待机 中上卦第6卦 天水讼(讼卦) 慎争戒讼 中下卦第7卦 地水师(师卦) 行险而顺 中上卦第8卦 水地比(比卦) 诚信团结 上上卦第9卦 风天小畜(小畜卦) 蓄养待进 下下卦第10卦 天泽履(履卦) 脚…

发表回复

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

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