"1: it forces jQuery to select all the select's on the page, and then
"somehow" to get to the one where event "onchange" was fired from"
And the other method does what differently?
The bottom line, the selector $("select") is bad/makes-little-sense no
matter *what* is inside...
on the other hand, inside the event
$(this).val()
is shorter/less-coding/better-than-reasons-already-posted-above than
$("select option:selected").val() <-- which makes less sense since
that will get the *first* <select>'s value no matter what
or
$("option:selected", this).val()
On Oct 13, 8:50 pm, DBJDBJ <dbj...@gmail.com> wrote:
> $("select").change(function() {
> alert( $(this).val() );
> });
>
> Is not so good for a few reasons:
>
> 1: it forces jQuery to select all the select's on the page, and then
> "somehow" to get to the one where event "onchange" was fired from.
> 2: it uses the slowest form of dom selection , namely by tag name
> ...
> etc
>
> Please get into the habit of *always* using the 'context' argument.
> when initally calling $().
> And have dom node as a context argument.
> (http://brandonaaron.net/blog/2009/06/24/understanding-the-context-in-...
> )
> Which in turn is forcing you to use (a lot ) more 'containers' in
> order to balance the dom tree in your pages.
>
> So, imagine there is a form on your page which contains one or more
> select's:
>
> $("#mySelect25", $("myForm")[0] ).change(function() {
> alert( $(this).val() );
> });
>
> Would be the preffered way ... Or just a 'container' div that
> contains our select :
>
> $("#mySelect25", $("myDIV")[0] ).change(function() {
> alert( $(this).val() );
> });
>
> In real life situations you might have (for example a toolbar with
> buttons etc inside it. So:
>
> $tbar = $("myToolbarDiv", document.body ) ;
>
> $tbar.find("button:first").click ( function () {} ) ;
> $tbar.find("button:last").click(function () { } ) ;
> $tbar.find("#mySelect25").change(function() {
> alert( $(this).val() );
> });
>
> Your (real) pages will inevitably grow and the usage of context and
> container elements and id's in selectors will speed up things
> noticeably.
>
> PS: find() is actually the fastest way to select, it is a straight
> Sizzle call. But it needs a container *arround* what are we looking
> for: $("#container").find("whatever is inside")
>
> --DBJ
