语法：

$(selector).bind(eventType[, eventData], handler(eventObject));

参数解释:

    <li>eventType(String): 一个包含一个或多个DOM事件类型的字符串， 比如"click"或"submit"或自定义事件的名称。</li>
    
<li>eventData(Ojbect): 可选，它包含的数据键值对映射将被传递给时间处理程序</li>
    
<li>handler(function): 每当时间触发时执行的函数</li>

    作用：为每一个匹配元素的特定时间(如click)绑定一个时间处理器函数。

    示例代码：

    .bind()的一个基本用法，绑定一个或者多个DOM事件

    当每个p标签被点击的时候，显示其文本

    <!DOCTYPE html>
    
<html lang="en">
    
<head>
    
    <meta charset="UTF-8">
    
    <title>bind Demo</title>
    
    <style type="text/css">
    
        p{
    
            background-color: yellow;
    
            font-weight: bold;
    
            cursor: pointer;
    
            padding: 5px;
    
        }

        p.over{
    
            background-color: #ccc;
    
        }

        span{
    
            color: red;
    
        }

    </style>
    
    <script type="text/javascript" src="jquery.js"></script>
    
    <script type="text/javascript">
    
        $(function(){
    
            $("p").bind("click", function(event){
    
                $("span").text("Click happened!"); 

            });

            $("p").bind("dblclick", function(){
    
                $("span").text("Double-click happened!");
    
            });

            $("p").bind("mouseenter mouseleave", function(event){
    
                $(this).toggleClass("over");
    
            });
    
        })
    
    </script>
    
</head>
    
<body>
    
    <p>Click or double clice here.</p>
    
    <span></span>
    
</body>
    
</html>

    还可以在event处理之前传递一些附加的数据

    function handler(event){
    
    // event.data可以划去bind()方法的第二个参数的数据
    
    alert(event.data.foo);
    
}
    
$("p").bind("click", {foo: "bar"}, handler())

    通过返回false来取消默认的行为， 并阻止事件起泡

    $("form").bind('submit', function() {return false; });

    或者通过preventDefault()方法只取消默认的行为

    $("form").bind("submit", function(event){
    
    event.preventDefault();
    
})

    jQuery事件之绑定事件的更多相关文章

    1. 关于Jquery的delegate绑定事件无效

      今天在做一个页面,用的是easyui页面有很多的tabs,里面都放了iframe 需要在load事件动态调整iframe高度 发现始终无法使用delegate来绑定load事件. 纠结了一下午发现了问 ...

    2. jQuery学习-事件之绑定事件（三）

      在上一篇<jQuery学习-事件之绑定事件(二)>我们了解了jQuery的dispatch方法,今天我们来学习下handlers 方法: handlers: function( event ...

    3. jQuery学习-事件之绑定事件（二）

      在上一篇<jQuery学习-事件之绑定事件(一)>我们了解了jQuery的add方法,今天我们来学习下dispatch方法: dispatch: function( event ) {   ...

    4. JQuery Mobile - 为什么绑定事件后会被多次执行？

      JQuery Mobile 在绑定事件时候,发现会被多次执行,为什么啊? 原来,jquery click  不是替换原有的function ,而是接着添加,所以才会执行次数越来越多,怎么办才能按需实现 ...

    5. jquery-10 jquery中的绑定事件和解绑事件的方法是什么

      jquery-10 jquery中的绑定事件和解绑事件的方法是什么 一.总结 一句话总结:bind(); unbind(); one(); 1. jquery中的绑定事件和解绑事件的方法是什么? bi ...

    6. 2017年3月25日工作日志：Jquery使用小结[绑定事件判断、select标签、军官证正则]

      jQuery获取DOM绑定事件 在1.8.0版本之前,我们要想获取某个DOM绑定的事件处理程序可以这样: $.data(domObj,'events');//或者$('selector').data( ...

    7. jQuery添加html绑定事件

      jQuery添加html绑定事件 $("#xxx").on("click",".dev",function(){ });

    8. jquery中on绑定事件

      之前项目中动态创建的标签元素  在绑定事件的时候  都是无效  无论如何都不能触发 eg:在页面加载完成之后   再由脚本动态创建的<div>元素  在绑定事件的时候 例如click事件 ...

    9. jquery之on()绑定事件和off()解除绑定事件

      off()函数用于移除元素上绑定的一个或多个事件的事件处理函数. off()函数主要用于解除由on()函数绑定的事件处理函数. 该函数属于jQuery对象(实例). 语法 jQuery 1.7 新增该 ...

    10. jQuery的live绑定事件在mobile safari（iphone / ipad / ipod）上失效的解决方案

      jQuery的live绑定为什么会在mobile safari上失效呢?其实可以追溯到jQuery里live的实现方式.live的实现方式实际上是通过事件委托机制来实现的,也就是说是通过诸如冒泡的方式 ...

    随机推荐

    1. Java 封装与类

      一.面向对象编程 面向对象编程三大特性:封装.继承和多态. 类是实现封装的手段,是面向对象编程的基本单元. 封装隐藏了类的内部实现细节,暴露给外界可控的操作,提高数据的完整性和安全性,提高模块的可重用 ...

    2. charles 抓包 （一）

      在web.app开发中经常需要通过抓包来定位页面.接口返回数据的问题.在mac系统中,charles是一款功能丰富的抓包软件.可以实现app的数据抓包. 工具:charles 附送charles的破解 ...

    3. Autofac通过配置的方式

      autofac是比较简单易用的IOC容器.下面我们展示如何通过json配置文件,来进行控制反转. 需要用到以下程序集.可以通过nugget分别安装 Microsoft.Extensions.Confi ...

    4. 你不知道的css各类布局（四）之响应式布局

      响应式布局 概念 响应式布局指的是同一页面在不同屏幕尺寸下有不同的布局 布局特点 响应式设计的目标是确保一个页面在所有终端上(各种尺寸的PC.手机.手表.冰箱的Web浏览器等等)都能显示出令人满意的效 ...

    5. wpf之二进制资源

      一.当需要添加图片.音频.视屏的资源到wpf项目里是,可以直接把文件添加到项目里 右击add->existing item. 1.如果想将外部文件编异常目标成为二进制资源,在文件的属性窗口 Bu ...

    6. dva中的一些备忘

      dva/router就是react-router-dom dva/router里的routerRedux就是react-router-redux 一个react的单页面应用: 编写一个基础框架,包含单 ...

    7. webpack整合 vue-router 路由,模块嵌套,整合Mint UI,MUI

      webpack整合 vue-router 结构 各个文件内容,一共八个文件, 还有src components 目录 Login.vue <template> <div> &l ...

    8. Shell-使用mkfifo实现多任务并发及并发数控制

      以下为代码实现的一个模拟场景:3个生产者,在不断提供服务,处理需求,假设1s处理一个. 20个消费者,在不断消耗供给产品,提交需求,假设3s消耗一个. 情景分析:由于消费者的提交需求能力 和 生产者处 ...

    9. 让框架内循环或者指定元素 指定CSS

      p:nth-child(3n+) { background:#ff0000; } http://www.w3school.com.cn/cssref/selector_nth-child.asp

    10. 百度编辑神器ueditor在ajax或form提交内容时候异常

      百度编辑神器ueditor在ajax或form提交内容时候异常,一:⑴web.config中<system.web> <httpRuntime requestValidationMo ...