ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

jQuery事件(1)

2021-12-19 11:01:01  阅读:181  来源: 互联网

标签:jQuery 元素 change 事件 data click fn


事件:

 

1.  blur([[data],fn]): 当元素失去焦点时触发 blur 事件。

fn:在每一个匹配元素的blur事件中绑定的处理函数。

使用示例:

$('input[type="text"]').blur(function () {
    $('#div1').css('color','yellow')//单行css样式
    $('#div1').css({//多行css样式
      'color':'red',
      'background':'lightblue',
      "width":"100px"
    })
  })

 

2.  change([[data],fn]):当元素的值发生改变时,会发生 change 事件。

该事件仅适用于文本域(text field),以及 textarea 和 select 元素。当用于 select 元素时,change 事件会在选择某个选项时发生。

当用于 text field 或 text area 时,该事件会在元素失去焦点时发生。

使用: 触发被选元素的 change 事件。

给所有的文本框增加输入验证。

使用示例:

$(selector).change();//触发被选元素的 change 事件。

3.  click([[data],fn]):触发每一个匹配元素的click事件,调用执行绑定到click事件的所有函数。

data:click([Data], fn) 可传入data供函数fn处理。

fn:在每一个匹配元素的click事件中绑定的处理函数。

使用示例:

$("p").click();//触发页面内所有段落的点击事件

4.  dblclick([[data],fn]):当双击元素时,会发生 dblclick 事件。

当鼠标指针停留在元素上方,然后按下并松开鼠标左键时,就会发生一次 click。在很短的时间内发生两次 click,即是一次 double click 事件。

5.  focus([[data],fn]):当元素获得焦点时,触发 focus 事件。

使用示例:

$(document).ready(function(){
  $("#button").focus();
});//当页面加载后将 id 为button的元素设置焦点:

6.  focusin([data],fn):

当元素获得焦点时,触发 focusin 事件。

focusin事件跟focus事件区别在于,他可以在父元素上检测子元素获取焦点的情况。

7.  focusout([data],fn)

当元素失去焦点时触发 focusout 事件。

focusout事件跟blur事件区别在于,他可以在父元素上检测子元素失去焦点的情况。

8.  keydown([[data],fn]):

当键盘或按钮被按下时,发生 keydown 事件。

9.  keypress([[data],fn]):

当键盘或按钮被按下时,发生 keypress 事件。

keypress 事件与 keydown 事件类似。当按钮被按下时,会发生该事件。

它发生在当前获得焦点的元素上。 不过,与 keydown 事件不同,每插入一个字符,就会发生 keypress 事件。

10.  keyup([[data],fn]):

当按钮被松开时,发生 keyup 事件。它发生在当前获得焦点的元素上。

使用示例:

$("input").keyup(function(){
  $("input").css("background-color","#D6D6FF");
});//当按下按键时,改变文本域的颜色:

标签:jQuery,元素,change,事件,data,click,fn
来源: https://www.cnblogs.com/yj-fqq/p/15706797.html

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有