Undo the result of one jQuery event handler when the opposite occurs
I just started looking into jQuery yesterday, before this I programmed in only PHP. So the best way I can explain what I'm looking for, is a way to say "else" in jQuery.
Suppose I have the following:
$('input').click(function() {
$(this).addClass('fieldBorder');
});
How can I say "when the input field is clicked out of, then remove the class fieldBorder". I see a lot of ways to do things in jQuery but how does one say the opposite when the user's action has transpired.
Another example:
$('a.clickMe').mouseover(function() {
$('hiddenMessage').show();
});
In the above example, is the only way to hide the hidden message once the user has ceased mousing over the link to use som开发者_如何转开发ething like this:
$('a.clickMe').mouseout(function() {
$('hiddenMessage').hide();
});
I get the nagging feeling that there is a much simpler/less redundant way of doing it. Is that what a "call back" is?
EDIT
From the answers I'm guessing there is no easy way to do it. However I did notice in the ajax function you have this:
$.ajax({
type: 'get'
url: 'script.php',
data: 'foo=boo';
success: function() {
alert('it worked');
}, error: function() {
alert('it did not work');
}
})
which that , something else: function() part existed for all other jQuery code as well.
I think you want the mouseup event, although perhaps you want the blur event. I'm not sure what "clicked out of" means exactly.
As for mouseover/mouseout, there is the hover event that lets you pair the handlers.
There is no "on the 'opposite' event (whatever that may be) please somehow run the reverse of all the code that I just ran in this handler". It sounds interesting, though! :)
That's not really a jQuery thing, it's about how the browser handles events.
An element can have focus. If it can, if can also lose that focus. The event that is fired when an element loses focus is the blur event.
Depending on what kind of element you're talking about though, it may never gain focus, even if clicked upon, or it may lose focus at a different time than is convenient for you. In that case you may simply want to listen to when the user clicks on the document or <body>, and determine if you need to do something.
AJAX success and error handlers are not quite the same thing as event handling. At some specific point, an AJAX request either succeeds or fails, it's a one-time if..else. Events are more complex though, any event may fire at any time, and there isn't necessarily an "opposite" event. What's the opposite of a click? There's no such thing as unclick. There's only a click on a different element.
There are certain idioms on how to build specific behavior using these constraints. Like, display some element when clicking on a link, and hide the element when clicking on any element that's not the link or the displayed element.
For example, you attach a click event handler to the document, which will catch all click events. For each triggered event, you determine whether its target was some specific element or a child of that element.
For an alternative, you have to understand that events bubble up. When you click on some element, the click event of that element will be triggered. Then the click event of the element's parent will be triggered and so on, until the top element is reached (that's how the document catches all events as well).
You can attach an event to the document that does something. You also attach a click event to some specific element that stops the event from bubbling up. This way, you have created the effect of "do something when clicking on anything but the specific element".
This is another way of doing it. It can be considered as if/else statement in other ways.
$("#id").hover(function(e){
//you can do whatever you want on mouseover here.
},
function(){
//you can do whatever you want on mouse out here.
});
加载中,请稍侯......
精彩评论