Added support for multiple live event handlers, live hover, and live focus/blur (mapped to focusin/focusout). Fixes #5804, #5801, #5852.
This commit is contained in:
parent
b9ca157998
commit
01f72026ec
3 changed files with 80 additions and 9 deletions
33
src/event.js
33
src/event.js
|
@ -838,23 +838,38 @@ jQuery.fn.extend({
|
|||
|
||||
hover: function( fnOver, fnOut ) {
|
||||
return this.mouseenter( fnOver ).mouseleave( fnOut || fnOver );
|
||||
},
|
||||
}
|
||||
});
|
||||
|
||||
jQuery.each(["live", "die"], function( i, name ) {
|
||||
jQuery.fn[ name ] = function( types, data, fn ) {
|
||||
var type, i = 0;
|
||||
|
||||
live: function( type, data, fn ) {
|
||||
if ( jQuery.isFunction( data ) ) {
|
||||
fn = data;
|
||||
data = undefined;
|
||||
}
|
||||
|
||||
jQuery( this.context ).bind( liveConvert( type, this.selector ), {
|
||||
data: data, selector: this.selector, live: type
|
||||
}, fn );
|
||||
types = types.split( /\s+/ );
|
||||
|
||||
return this;
|
||||
},
|
||||
while ( (type = types[ i++ ]) ) {
|
||||
type = type === "focus" ? "focusin" : // focus --> focusin
|
||||
type === "blur" ? "focusout" : // blur --> focusout
|
||||
type === "hover" ? types.push("mouseleave") && "mouseenter" : // hover support
|
||||
type;
|
||||
|
||||
if ( name === "live" ) {
|
||||
// bind live handler
|
||||
jQuery( this.context ).bind( liveConvert( type, this.selector ), {
|
||||
data: data, selector: this.selector, live: type
|
||||
}, fn );
|
||||
|
||||
die: function( type, fn ) {
|
||||
jQuery( this.context ).unbind( liveConvert( type, this.selector ), fn ? { guid: fn.guid + this.selector + type } : null );
|
||||
} else {
|
||||
// unbind live handler
|
||||
jQuery( this.context ).unbind( liveConvert( type, this.selector ), fn ? { guid: fn.guid + this.selector + type } : null );
|
||||
}
|
||||
}
|
||||
|
||||
return this;
|
||||
}
|
||||
});
|
||||
|
|
|
@ -83,6 +83,7 @@
|
|||
<td id='radiofocus' class="red">RADIO</td>
|
||||
<td id='textfocus' class="red">TEXT</td>
|
||||
<td id='textareafocus' class="red">TEXTAREA</td>
|
||||
<td id='boundFocus' class="red">DOCUMENT</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Focusout:</td>
|
||||
|
@ -92,6 +93,25 @@
|
|||
<td id='radioblur' class="red">RADIO</td>
|
||||
<td id='textblur' class="red">TEXT</td>
|
||||
<td id='textareablur' class="red">TEXTAREA</td>
|
||||
<td id='boundBlur' class="red">DOCUMENT</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Live Focus:</td>
|
||||
<td id='selectlfocus' class="red">SELECT</td>
|
||||
<td id='mselectlfocus' class="red">MULTI</td>
|
||||
<td id='checkboxlfocus' class="red">CHECKBOX</td>
|
||||
<td id='radiolfocus' class="red">RADIO</td>
|
||||
<td id='textlfocus' class="red">TEXT</td>
|
||||
<td id='textarealfocus' class="red">TEXTAREA</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Live Blur:</td>
|
||||
<td id='selectlblur' class="red">SELECT</td>
|
||||
<td id='mselectlblur' class="red">MULTI</td>
|
||||
<td id='checkboxlblur' class="red">CHECKBOX</td>
|
||||
<td id='radiolblur' class="red">RADIO</td>
|
||||
<td id='textlblur' class="red">TEXT</td>
|
||||
<td id='textarealblur' class="red">TEXTAREA</td>
|
||||
</tr>
|
||||
</table>
|
||||
<h2>Submit Tests</h2>
|
||||
|
@ -136,6 +156,12 @@
|
|||
jQuery(id + "blur").blink();
|
||||
});
|
||||
|
||||
this.bind("focus", function(){
|
||||
jQuery(id + "lfocus").blink();
|
||||
}).bind("blur", function(){
|
||||
jQuery(id + "lblur").blink();
|
||||
});
|
||||
|
||||
return this.bind("change", function(e){
|
||||
jQuery(id + "bind").blink();
|
||||
}).live("change", function(e){
|
||||
|
@ -163,7 +189,23 @@
|
|||
next();
|
||||
});
|
||||
};
|
||||
|
||||
$(document).bind("focusin", function() {
|
||||
jQuery("#boundFocus").blink();
|
||||
});
|
||||
|
||||
$(document).bind("focusout", function() {
|
||||
jQuery("#boundBlur").blink();
|
||||
});
|
||||
|
||||
$("td.red").live("hover", function(e) {
|
||||
if ( e.type === "mouseenter" ) {
|
||||
$(this).css("backgroundColor","green");
|
||||
} else {
|
||||
$(this).css("backgroundColor","");
|
||||
}
|
||||
});
|
||||
|
||||
$(".select_test").addChangeTest("#select");
|
||||
$(".mselect_test").addChangeTest("#mselect");
|
||||
$(".checkbox_test").addChangeTest("#checkbox");
|
||||
|
|
|
@ -864,6 +864,20 @@ test(".live()/.die()", function() {
|
|||
jQuery("#nothiddendiv div").die("click");
|
||||
});
|
||||
|
||||
test("live with multiple events", function(){
|
||||
expect(1);
|
||||
|
||||
var count = 0;
|
||||
var div = jQuery("div#nothiddendivchild")
|
||||
|
||||
div.live("click submit", function(){ count++; });
|
||||
|
||||
div.trigger("click");
|
||||
div.trigger("submit");
|
||||
|
||||
equals( count, 2, "Make sure both the click and submit were triggered." );
|
||||
});
|
||||
|
||||
test("live with change", function(){
|
||||
var selectChange = 0, checkboxChange = 0;
|
||||
|
||||
|
|
Loading…
Reference in a new issue