jQuery中delegate()方法用法实例

 更新时间:2015年01月19日 12:16:39   投稿:shichen2014  
这篇文章主要介绍了jQuery中delegate()方法用法,实例分析了delegate()方法的功能、定义及为匹配元素的子元素添加一个或多个事件,并规定当这些事件发生时运行函数的使用技巧,需要的朋友可以参考下

本文实例讲述了jQuery中delegate()方法用法。分享给大家供大家参考。具体分析如下:

此方法为匹配元素的子元素添加一个或多个事件,并规定当这些事件发生时运行的函数。

语法结构:

复制代码 代码如下:
$(selector).delegate(childofselector,type,data,function)

参数列表:

参数 描述
childofselector 定义要附加事件处理程序的一个或多个子元素。
type 可选。定义附加到元素的一个或多个事件类型。由空格分隔多个事件值。
data 定义传递到事件处理函数的额外数据。
function 定义当事件发生时运行的函数。

实例代码:

复制代码 代码如下:

<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="https://www.jb51.net/" />
<title>脚本之家</title>
<style type="text/css">
li{
  list-style-type:none;
  width:150px;
  height:150px;
  border:1px solid green;
}
</style>
<script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script>
<script type="text/javascript">
$(document).ready(function(){
  $("div").delegate("button","click",function(){
    $("li").slideToggle();
  })
})
</script>
</head>
<body>
<div>
  <ul>
    <li>脚本之家欢迎您</li>
  </ul>
  <button>点击查看效果</button>
</div>
</body>
</html>

以上代码可以div的子元素button元素注册click事件处理函数,当点击按钮的时候能够实现隐藏和显示的切换。

希望本文所述对大家的jQuery程序设计有所帮助。

相关文章

  • jquery删除table当前行的实例代码

    jquery删除table当前行的实例代码

    下面小编就为大家带来一篇jquery删除table当前行的实例代码。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2016-10-10
  • jquery配合css简单实现返回顶部效果

    jquery配合css简单实现返回顶部效果

    返回顶部效果想必大家并不陌生吧,其实实现方法有很多,在本文为大家介绍下使用jquery是如何轻易实现的,感兴趣的朋友可以参考下
    2013-09-09
  • jquery $.ajax入门应用一

    jquery $.ajax入门应用一

    这个方法把ajax方法封装一下,方便调用
    2008-11-11
  • jQuery 动画基础教程

    jQuery 动画基础教程

    用jquery实现简单动画的制作,希望看了这篇文章后,建议大家自己手工打打,学习一下他的思路。
    2008-12-12
  • jQuery结合ajax实现动态加载文本内容

    jQuery结合ajax实现动态加载文本内容

    本文实例讲述了jquery通过ajax加载一段文本内容的方法。分享给大家供大家参考。这是一个简单的例子,注意编码问题,否则可能会出现乱码。
    2015-05-05
  • jQuery使用deferreds串行多个ajax请求

    jQuery使用deferreds串行多个ajax请求

    这篇文章主要介绍了jQuery使用deferreds串行多个ajax请求的相关资料,非常不错,具有参考借鉴价值,需要的朋友可以参考下
    2016-08-08
  • JQuery中模拟image的ajaxPrefilter与ajaxTransport处理

    JQuery中模拟image的ajaxPrefilter与ajaxTransport处理

    这篇文章主要介绍了JQuery中模拟image的ajaxPrefilter与ajaxTransport处理,本文直接给出模拟实现代码,代码中包含详细注释,需要的朋友可以参考下
    2015-06-06
  • jquery跟js初始化加载的多种方法及区别介绍

    jquery跟js初始化加载的多种方法及区别介绍

    jquery是等待页面加载完数据,以及页面部分元素;js是页面全部加载完成才执行初始化加载,具体示例祥看本文
    2014-04-04
  • JSON格式化输出

    JSON格式化输出

    本文主要是记录一个项目中用到的对输出的json进行格式化的小技巧,也是看到一位朋友分享的,这里mark一下,有需要的小伙伴也可以参考下。
    2014-11-11
  • Jquery中$.post和$.ajax的用法小结

    Jquery中$.post和$.ajax的用法小结

    本节重点讲的是jquery中调用ajax的4种方法中最常用的:$.post、和$ajax。如果读者没有javascript和jquery的知识,或者没有ajax的概念,那么请先去问问度娘,再来读本文。
    2015-04-04

最新评论