jquery中常用的函数和属性详细解析(2)


$.fn.extend({       
   alertWhileClick:function(){     
       $(this).click(function(){     
            alert($(this).val());    
        });    
     }    
});


引用jQuery:
$("#input1").alertWhileClick();

jQuery( expression, [context] ) ---$( expression, [context]); 在默认情况下,$()查询的是当前HTML文档中的DOM元素。

each( callback ) 以每一个匹配的元素作为上下文来执行一个函数

举例:1

复制代码 代码如下:


$("span").click(function){
$("li").each(function(){
$(this).toggleClass("example");
});
});


举例:2

复制代码 代码如下:


$("button").click(function () {
$("div").each(function (index, domEle) {
// domEle == this
$(domEle).css("backgroundColor", "yellow");
if ($(this).is("#stop")) {
$("span").text("Stopped at div index #" + index);
return false;
}
});
});


jQuery Event:事件

ready(fn); $(document).ready()注意在body中没有onload事件,否则该函数不能执行。在每个页面中可以有很多个函数被加载执行,按照fn的顺序来执行。

例子:
$(document).ready(function(){alert("aa");}

bind( type, [data], fn ) 为每一个匹配元素的特定事件(像click)绑定一个或多个事件处理器函数。可能的事件type属性有:blur, focus, load, resize, scroll, unload, click, dblclick, mousedown, mouseup, mousemove,mouseover, mouseout, mouseenter, mouseleave, change, select, submit, keydown, keypress,keyup, error

例子1:
$('#myBtn').bind("click",function(){   
alert('click');
});

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

one( type, [data], fn ) 为每一个匹配元素的特定事件(像click)绑定一个或多个事件处理器函数。在每个对象上,这个事件处理函数只会被执行一次。其他规则与bind()函数相同。
type(String) : 事件类型。
data(Object) : (可选) 作为event.data属性值传递给事件对象的额外数据对象。
fn(Function) : 绑定到每个匹配元素的事件上面的处理函数。

trigger( type, [data] ) 在每一个匹配的元素上触发某类事件。
$("p").click( function (event, a, b) {
   // 一个普通的点击事件时,a和b是undefined类型
   // 如果用下面的语句触发,那么a指向"foo",而b指向"bar"
} ).trigger("click", ["foo", "bar"]); toggle( fn, fn ) 如果点击了一个匹配的元素,则触发指定的第一个函数,当再次点击同一元素时,则触发指定的第二个函数。
$("p").toggle(function(){
$(this).addClass("selected");
},
function(){
$(this).removeClass("selected");
}
);

例子:
$("p").bind("myEvent", function (event, message1, message2) {
   alert(message1 + ' ' + message2);
});
$("p").trigger("myEvent", ["Hello","World!"]);
triggerHandler( type, [data] ) 这一特定方法会触发一个元素上特定的事件(指定一个事件类型),同时取消浏览器对此事件的默认行动
unbind( [type], [data] ) 反绑定,从每一个匹配的元素中删除绑定的事件。
$("p").unbind() 移除所有段落上的所有绑定的事件
$("p").unbind( "click" ) 移除所有段落上的click事件

例子:

复制代码 代码如下:


var foo = function () {
   // 处理某个事件的代码
};
$("p").bind("click", foo); // ... 当点击段落的时候会触发函数foo
$("p").unbind("click", foo); // ... 再也不会被触发 foo

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/wdydwf.html