how works $(function(){}); in jquery
I like to know how works or what means(?) when you define a function in the selector in jquery like this.
$(functi开发者_高级运维on(){code,code})
because with jquery-ui you can (or must.. I'm really new with this library) set accordion with this code
$(function(){
// Accordion
$("#accordion").accordion({ header: "h3" });
//hover states on the static widgets
$('#dialog_link, ul#icons li').hover(
function(){$(this).addClass('ui-state-hover');},
function(){$(this).removeClass('ui-state-hover');
});
});
Source: http://jqueryui.com/demos/accordion/
And I have a problem setting accodions inside tabs(also with jquery-ui), but I cann't find why works buggy, and I think that maybe can I fix the problem understanding this behavior.
And pretty sure that I doesn't undestood quiet right the selector in jquery, hope you can help me. Thanks in advance, by the way sorry about my poorly english.
$(function(){ /*...*/ });
Is the same as:
$(document).ready(function(){ /*...*/ });
Basically, it just holds off code-execution until the document is ready. It's just an anonymous function. You see the same thing in your $.hover()
call, which takes two anonymous functions - one to determine the "enter" logic, and the other to determine the "exit" logic.
$(".foo").hover(
function(){ alert("You entered!"); },
function(){ alert("You exited!!"); }
);
Sometimes these function bring with them different localized variables you can use. For instance, if you were to iterate through many elements using jQuery's $.each()
method:
$(".foo").each(function(i,o){
alert("Currently on " + i); // Currently on 0, Currently on 1...
});
You can see that we've got two variables i
and o
, available to us here. i
is the index of the current element being iterated, and o
is a reference to the element itself.
$(somefunction)
is a shorthand for $(document).ready(somefunction)
. So what you're doing with $(function{})
is defining an anonymous function that will run once the document loads.
They've just written it out in a way you've probably not seen before. The hover method takes two possible functions, one for entering and one for exiting. Sometimes written:
$('#dialog_link, ul#icons li').hover(function(){
//stuff to do on mouseenter
$(this).addClass('ui-state-hover');
}, function(){
//stuff to do on mouseleave
$(this).removeClass('ui-state-hover');
});
Documentation: http://api.jquery.com/hover/#hover1
$(function () {})
is short-hand for jQuery(function () {})
, which is short-hand for $(document).ready(function () {})
. I.e. it binds a function to the Document's Ready event, i.e. this code will get executed when the document finished loading. It's what you should always do.
http://api.jquery.com/jQuery/#jQuery3
精彩评论