jquery 深入学习笔记之一（事件绑定）

爱被打了一巴掌 2022-08-02 18:28 172阅读 0赞

【jquery 事件绑定】

## 1、添加元素事件绑定 ##

### (1) 添加事件为当前元素 ###

$('p').on('click',function(){
        //code here ...
    });

### (2) 添加事件为未来元素(动态添加元素) ###

$(document父).on('click','p子',function(){
        //code here...
    })

注意前后俩者对象是父子关系(只要是父子均可)

### (3) 多个事件同时绑定 ###

$(document).ready(function(){
      $("p").on({
        mouseover:function(){$(this).css("background-color","lightgray");},  
        mouseout:function(){$(this).css("background-color","lightblue");}, 
        click:function(){$(this).css("background-color","yellow");}  
      });
    });

## 2、移除元素事件绑定 ##

### (1) 移除所有的事件 ###

$( "p" ).off();

### (2) 移除所有点击事件 ###

$( "p" ).off( "click", "**" );

### (3) 移除某个特定的绑定程序 ###

$( "body" ).off( "click", "p", foo );

### (4) 解绑某个类相关的所有事件处理程序 ###

$(document).off(".someclass");

## 3. 添加元素一次事件绑定 ##

一次触发，事件自动解除

$( "#foo" ).one( "click", function() {
      alert( "This will be displayed only once." );
    });

等价于：

$("#foo").on("click", function(event){
      alert("This will be displayed only once.");
      $(this).off(event);
    });

发表评论取消回复

表情：

评论列表（有 0 条评论，172人围观）

还没有评论，来说两句吧...

相关阅读

相关 jQuery学习笔记12-绑定及解绑事件

、绑定事件 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UT...

港控/mmm°/ 2024年04月17日 18:40/ 0 赞/ 83 阅读

相关 JQuery事件绑定方式

JQuery事件绑定方式 <!DOCTYPE html> <html> <head> <meta charset="utf-8">

谁践踏了优雅/ 2022年12月18日 05:59/ 0 赞/ 266 阅读

相关 JQuery-事件绑定详解

目录定义元素监听事件 on() 绑定事件 -------------------- 定义元素监听事件语法：$(选择器).监听事件名称(处理函数); 说明

一时失言乱红尘/ 2022年11月29日 12:20/ 0 赞/ 242 阅读

相关 JQuery-学习笔记06【高级——JQuery事件绑定和切换】

> [Java后端学习路线笔记汇总表【黑马程序员】][Java_ _] > > 1. [JQuery-学习笔记01【基础——JQuery基础】][JQuery-_

我会带着你远行/ 2022年10月30日 11:25/ 0 赞/ 188 阅读

相关 jQuery动态绑定事件

jquery中绑定事件一般使用bind，或者click，但是这只能是对已经加载好的元素定义事件，那些后来添加插入的元素则需要另行绑定。在1.7版本以前使用live。但是在1.8

水深无声/ 2022年09月30日 12:57/ 0 赞/ 297 阅读

相关 jquery 深入学习笔记之一（事件绑定）

【jquery 事件绑定】 1、添加元素事件绑定 (1) 添加事件为当前元素 $('p').on('click',function(){

爱被打了一巴掌/ 2022年08月02日 18:28/ 0 赞/ 173 阅读

相关 jquery绑定事件

bind()向匹配元素添加一个或多个事件处理器。 $(selector).bind(event,data,function) live() 向当前或未来的匹配元素添加一个

左手的ㄟ右手/ 2022年06月17日 01:27/ 0 赞/ 360 阅读

相关 JQuery_绑定事件

绑定：绑定事件：一.如何给元素同时绑定两个事件？方法一：链式编程 $('button').click(function(){ a

ゞ浴缸里的玫瑰/ 2022年05月20日 23:42/ 0 赞/ 391 阅读

相关 jQuery基础事件绑定

学习要点： 1.绑定事件 2.简写事件 3.复合事件 JavaScript有一个非常重要的功能，就是事件驱动。当页面完全加载后，用户通过鼠标或键盘触发页面中绑定事件的

分手后的思念是犯贱/ 2022年05月13日 11:36/ 0 赞/ 324 阅读

相关 jQuery--解除事件绑定

解除事件绑定在元素绑定事件之后，当在某个时刻不再需要该事件处理时，可以解除所绑定的事件。在jQuery中提供了unbind()和undelegate()方法，分别用于解

叁歲伎倆/ 2021年08月13日 18:59/ 0 赞/ 586 阅读