click() bind() live() delegate()区别

click()，bind()，live()都是执行事件时使用的方法

1.click()单击事件方法：

$("a").click(function() {

   alert("hello");

});

2.在bind()中，jQuery所有JavaScript事件对象，比如focus, mouseover, 和 resize，都是可以作为type参数传递进来的。

var message = "left";

$("a").bind("click", function() {

   alert(message);

   return false;

});

var message = "left";

$("a").bind("click", { msg: message }, function(e) {

   alert(e.data.msg);

   return false;

});

var message = "right";

$("a").bind("contextmenu", { msg: message }, function(e) {

   alert(e.data.msg);

   return false;

});

bind( )方法用于将一个处理程序附加到每个匹配元素的事件上并返回jQuery对象。

.bind(eventType[, evnetData], Handler(eventObject))

其中，参数eventType是一个字符串，包含一个或多个javaScript事件类型，例如click，submit或自定义事件的名称，指定多个事
件类型时用空格分隔各个类型；eventData为Map类型，给出要传递给事件处理程序的数据，handler指定触发该事件时要执行的函
数，eventObject表示事件对象。

.bind()方法将事件处理程序handler附加到匹配元素集合中的每个元素的eventType事件上，如果需要，还可以向事件处理程序传递数据。

3.live()给所有匹配的元素附加一个事件处理函数，即使这个元素是以后再添加进来的也有效。

如果元素是在调用bind()之后添加的，则不能够执行相应的事件。而使用live()方法使得在后边添加的元素也能够执行相应的事件，如下：

$("div.live").live("click", function() {

   alert("success");

});

这样，当我们单击class为live的a标签时，如果此a标签是后边添加的，也能照常输出"success"。

live()方法的一个不足在于它不支持链式写法：

$("#test").children("a").live("mouseover", function() {

    alert("hello");

});

上边这种写法并不会输出

使用delegate()可以写为：

$("#test").delegate("a", "mouseover", function() {

    alert("hello");

});

$('body').delegate('a:not([target="_blank"])', 'click', function (e) {

         if ($(this).attr('href') == location.hash) {

                    $(window).trigger('hashchange');

          }

 });

停止事件传播

$('a').bind('click',function(e){

      e.preventDefault()

      e.stopPropagation()}

)

if (e.stopPropagation) {

     e.stopPropagation();

}

e.cancelBubble = true;

e是事件触发后传进来的一堆参数，表示事件对象

巴特西

click() bind() live() delegate()区别

最新文章

热门文章