`

jQuery bind()用法深入

阅读更多

================初级用法=========

当每个段落被点击的时候,弹出其文本。

$("p").bind("click", function(){
  alert( $(this).text() );
});

 ==============中级用法=========

同时绑定多个事件类型/处理程序

$("button").bind({
  click:function(){$("p").slideToggle();},
  mouseover:function(){$("body").css("background-color","red");},  
  mouseout:function(){$("body").css("background-color","#FFFFFF");}  
});

 ==============高级用法=============

你可以在事件处理之前传递一些附加的数据。

function handler(event) {
  alert(event.data.foo);
}
$("p").bind("click", {foo: "bar"}, handler)

 ==============事件用法==============

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

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

 =============事件用法2=============

通过使用 preventDefault() 方法只取消默认的行为。

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

 ============事件用法3==============

通过使用 stopPropagation() 方法只阻止一个事件起泡。

$("form").bind("submit", function(event){
  event.stopPropagation();
});
分享到:
评论

相关推荐

    jquery使用bind绑定事件

    本篇文章将深入探讨如何使用jQuery中的`bind()`方法来绑定事件,并通过实例讲解如何改变页面上单行文本框(input[type="text"])的背景色。 `bind()`方法是jQuery提供的一种事件绑定功能,它可以将一个或多个事件...

    jQuery bind事件使用详解

    本文将深入探讨`bind`方法的使用,包括它的基本用法、多事件绑定、自定义事件和命名空间等特性。 首先,`bind`方法的基本用法是将一个或多个事件处理器(函数)附加到指定的元素。例如,以下代码会在用户点击ID为`...

    jQuery中bind(),live(),delegate

    今天我们将深入探讨jQuery中的事件绑定方法,包括`bind()`, `live()`, `delegate()`,以及后来推出的`on()`方法。这四个方法都是为了帮助开发者更方便地管理页面上的事件,特别是对于动态生成的元素。 1. **bind()*...

    JQuery 动态删除添加html元素bind事件

    本文将深入探讨“JQuery动态删除添加HTML元素及bind事件”这一主题,这在网页交互设计中非常常见。 首先,理解jQuery中的`$(document).ready()`函数至关重要。这个函数确保在页面加载完成后执行里面的代码,避免了...

    jQuery:bind() delegate() live()事件绑定

    在探讨jQuery中的`bind()`, `delegate()`, 和`live()`事件绑定方法的区别时,我们需要深入理解它们在处理DOM事件时的独特方式。这些方法在不同的场景下提供了灵活且高效的选择,帮助开发者创建响应式和动态的Web应用...

    jQuery使用bind动态绑定事件无效的处理方法

    然而,在处理动态生成的元素时,有时会遇到使用`bind()`方法绑定事件无效的问题。本篇文章将深入探讨这个问题,并提供解决方案。 首先,`bind()`是jQuery早期版本中用于添加事件处理程序的方法。它的基本语法是: ...

    jQuery中bind()方法用法实例

    下面我们将深入探讨`bind()`方法的用法、功能以及相关实例。 ### bind()方法的定义与功能 `bind()`方法的基本语法是: ```javascript $(selector).bind(eventType, data, function) ``` 1. `eventType`: 这个...

    JQuery中Bind()事件用法分析

    除了上述基本用法,`bind()`方法还可以与其他jQuery方法结合使用,实现更复杂的交互逻辑。例如,配合`.live()`或`.delegate()`方法,可以实现动态生成元素的事件绑定;使用`.unbind()`方法可以解除已绑定的事件。...

    jquery-1.9.1.js 、jquery-1.9.1.min.js 【官方jquery包 js】

    jQuery 1.9.1版本是一个重要的里程碑,它对旧的API进行了清理和重构,移除了一些不推荐使用的函数和方法,以保持库的简洁性和未来发展的兼容性。例如,`.live()`方法在这一版本中被移除,取而代之的是`.on()`和`.off...

    jQuery使用bind函数实现绑定多个事件的方法

    本篇文章将深入探讨如何使用jQuery的`bind`函数来实现绑定多个事件。 首先,`bind`函数的基本语法如下: ```javascript $(selector).bind(eventType, function[, data], handler); ``` 这里,`selector`是匹配...

    最新版JQuery-jquery-3.2.1.min.js

    在压缩包中的"jQuery API 中文文档3.2.1",为开发者提供了详细的API文档,帮助理解每个方法的用途、参数和返回值,是学习和使用jQuery的宝贵资源。确保查阅这些文档,以便更好地理解和应用jQuery 3.2.1的新特性。 ...

    jQuery1.3.1中文使用手册

    《jQuery1.3.1中文使用手册》是针对JavaScript库jQuery 1.3.1版本的一份详尽指南,旨在帮助开发者深入理解和高效利用jQuery进行网页交互和动态效果的实现。该手册包含了丰富的API(应用程序接口)解释和实例,使得在...

    jquery事件代理方式的区别联系

    本文将深入探讨jQuery中的事件代理方式,包括`live`, `delegate`和`bind`的区别与联系。 ### 事件冒泡与事件代理原理 事件冒泡是指事件从最深的节点开始,逐级向上层节点传播事件的过程。当一个元素触发事件,该...

    Jquery1.7使用以及讲解

    在本文中,我们将深入探讨jQuery 1.7这一版本的重要特性和常见用法。 ### 1. jQuery 1.7 版本亮点 jQuery 1.7 发布于2011年,是jQuery的一个关键更新,引入了一些重要的增强和优化。其中最显著的变化是对`.on()`...

    jQuery1.7.1.js+jQuery1.7.1中文API.zip

    - **事件绑定的统一**:在1.7.1中,`.on()`方法取代了`.bind()`, `.live()`, 和 `.delegate()`,成为统一的事件绑定接口。`.on()`方法更强大,可以处理当前及未来的元素事件,增强了代码的灵活性。 - **新选择器**...

    jquery1.7+jquery for json 2.3

    接下来,我们将深入探讨这两个组件的核心功能和使用方法。 一、jQuery 1.7的关键特性 1. **选择器增强**:jQuery 1.7进一步优化了选择器引擎,使其能更好地处理复杂的选择器表达式,提高了匹配元素的效率。 2. **...

    jQuery 1.6 中文API (适用jQuery 1.6,jQuery 1.6.1,jQuery 1.6.2)

    jQuery是JavaScript库中的一款经典工具,它极大地简化了DOM操作、事件处理、动画制作和Ajax交互。...下载并使用提供的jQuery 1.6中文API离线版,可以帮助开发者更快速地查找和理解各种方法和功能,提高开发效率。

    深入理解jQuery中live与bind方法的区别

    在jQuery库中,`live()` 和 `bind()` 都是用来为元素绑定事件处理函数的方法,但它们之间存在着显著的差异,这些差异对于理解和优化JavaScript代码至关重要。本文将深入探讨这两个方法的区别及其应用场景。 首先,`...

    jquery-API_CHM

    通过这两个文档,开发者不仅可以学习到基本的jQuery使用方法,如元素选择、属性操作、事件绑定等,还能了解高级特性,如插件开发、性能优化和最佳实践。同时,了解不同版本间的差异有助于开发者更好地适应项目需求,...

Global site tag (gtag.js) - Google Analytics