码迷,mamicode.com
首页 > 其他好文 > 详细

jq一些事件

时间:2018-06-22 01:08:07      阅读:161      评论:0      收藏:0      [点我收藏+]

标签:col   bind   鼠标   color   返回   css   插入   文档   round   

属性值操作:

1 attr() 方法设置或返回被选元素的属性值。
$("button").click(function(){
  $("img").attr("width","180");
});

CSS样式操作:
2 append() 方法在被选元素的结尾(内部)插入指定内容。
$("button").click(function(){
  $("p").append(" <b>Hello world!</b>");
});
3 prepend() 方法在被选元素的开头(内部)插入指定内容。
$("button").click(function(){
  $("p").prepend("<b>Hello world!</b>");
});
4 after() 方法在被选元素后插入指定的内容(外部)。
$("button").click(function(){
  $("p").after("<p>Hello world!</p>");
});
5 before() 方法在被选元素前插入指定的内容(外部)。
$("button").click(function(){
  $("p").before("<p>Hello world!</p>");
});
6 addClass() 方法向被选元素添加一个或多个类。
$("button").click(function(){
  $("p:first").addClass("class样式名");
});
7 removeClass() 方法从被选元素移除一个或多个类
$("button").click(function(){
  $("p:first").removeClass("class样式名");
});
8 hasClass() 方法检查被选元素是否包含指定的 class
$("button").click(function(){
  alert($("p:first").hasClass("class样式名"));
9 toggleClass() 从匹配的元素中添加或删除一个类。
$("button").click(function(){
  $("p").toggleClass("class样式名");
});
                                      事件:
1 bind() 方法为被选元素添加一个或多个事件处理程序,并规定事件发生时运行的函数。
 $("button").bind("click",function(){
    $("p").append(" <b>Hello world!</b>");
  });
2 blur()当元素失去焦点时发生 blur 事件。
 $("input").blur(function(){
  $("input").css("background-color","#D6D6FF");
});
3 change()当元素的值发生改变时,会发生 change 事件
 $(".field").change(function(){
     $(this).css("background-color","#FFFFCC");
   });
4 delegate()向匹配元素的当前或未来的子元素附加一个或多个事件处理器
 $("div").delegate("button","click",function(){
     $("p").slideToggle();
   });
5 pageX() 属性是鼠标指针的位置,相对于文档的左边缘。
6 result 属性包含由被指定事件触发的事件处理器返回的最后一个值,除非这个值未定义。
7 keydown()  触发、或将函数绑定到指定元素的 key down 事件
  keypress()  触发、或将函数绑定到指定元素的 key press 事件
  keyup()          触发、或将函数绑定到指定元素的 key up 事件
  完整的 key press 过程分为两个部分,按键被按下,然后按键被松开并复位。
 当按钮被松开时,发生 keyup 事件。它发生在当前获得焦点的元素上。
 当按钮被按下时,发生 keyup 事件。
8 mousedown() 当鼠标指针移动到元素上方,并按下鼠标按键时,会发生 mousedown 事件。
与 click 事件不同,mousedown 事件仅需要按键被按下,而不需要松开即可发生。
$("button").mousedown(function(){
  $("p").css("background-color","#FFFFCC");
});
9 mouseenter()当鼠标指针穿过元素时,会发生 mouseenter 事件。
$("p").mouseenter(function(){
  $("p").css("background-color","yellow");
});
10 mouseleave()当鼠标指针离开元素时,会发生 mouseleave 事件。
$("p").mouseleave(function(){
  $("p").css("background-color","#E9E9E4");
});
11  mousemove()当鼠标指针在指定的元素中移动时,就会发生 mousemove 事件。
mouseout() 当鼠标指针从元素上移开时,发生 mouseout 事件
mouseover() 当鼠标指针位于元素上方时,会发生 mouseover 事件。
mouseup() 当在元素上放松鼠标按钮时,会发生 mouseup 事件。
12 resize() 当调整浏览器窗口的大小时,发生 resize 事件。
x =0
$(window).resize(function() {
  $("span").text(x+=1);
});
13 scroll() 当用户滚动指定的元素时,会发生 scroll 事件。
14 select()当 textarea 或文本类型的 input 元素中的文本被选择时,会发生 select 事件。
15 submit()当提交表单时,会发生 submit 事件。
16 toggle() toggle() 方法切换元素的可见状态。
17 trigger() trigger() 方法触发被选元素的指定事件类型。
 $("input").select(function(){
    $("input").after("文本被选中!");
  });
  $("button").click(function(){
    $("input").trigger("select");
  });

jq一些事件

标签:col   bind   鼠标   color   返回   css   插入   文档   round   

原文地址:https://www.cnblogs.com/zhengleilei/p/9211333.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!