Is using THIS more efficent than using the selector?

Question

I have a simple form so user send his vote.
There I need to know what radio button user select.
The version I found to solve it was this. How can I get which radio is selected via jQuery?

value = $('input[name=vote]:checked', '#frmSurvey').val();

This work ok. Even when I dont understand how that work, because in Jquery selector documentation there is only 2 example with item separated by coma. And neither match my example where each element is inside a quote and then a coma

.class , .class ---> $(".intro,.demo") All elements with the class "intro" or "demo"
el1 , el2 , el3 ---> $("h1,div,p") All < h1>, < div> and < p> elements

Both looks like OR selector instead of find A and then find B inside A.

So if anyone can tell me what kind of selector is that I would love to take a look into the documentation

Now the optimization I was thinking. If I already inside a function for #frmSurvey won't be faster if I use the this element

 $('#frmSurvey').ajaxForm(function () {                                
            value = $('input[name=vote]:checked', '#frmSurvey').val();
            console.log('working way ' + value);

            value = $(this).find('input[name=vote]:checked').val();
            console.log('testing way ' + value);

But I couldn't make the second version to work. Second value get me undefined.

So how I fix second version?

And would be second version better than first one as my instinct suggest or I'm worrying too much?

`$('input[name=vote]:checked', '#frmSurvey')` is not a single selector. It's http://api.jquery.com/jQuery/#jQuery-selector-context instead. *"Second value get me undefined."* Maybe `this` doesn't refer to `#frmSurvey` then? — Felix Kling, Mar 17 '15 at 15:49
Thanks @FelixKling, as Klors mention `ajaxForm` create a diferent context. If I create `$('#frmSurvey').click(function ()` there my `$(this)` verson works — Juan Carlos Oropeza, Mar 17 '15 at 16:09

Klors · Accepted Answer · 2015-03-17T16:22:38.433

1

Your first example shows a selector operating from a context selector, whereas the documentation you've shown shows a "multiple selectors" selector.

You seem to have partially grasped this as

value = $('input[name=vote]:checked', '#frmSurvey').val();

is essentially the same as

value = $('#frmSurvey').find('input[name=vote]:checked').val();

However, the context of "this" inside your function is not clear as it depends upon how the ajaxForm plugin is coded. It isn't necessarily the result of your initial selector. After a short play with the plugin, it would appear that this in the context of ajaxForm is the jQuery ajax request object.

edited Mar 17 '15 at 16:22

answered Mar 17 '15 at 15:50

Klors

2,665
2
25
42

Thanks for the context selector, didnt know that part. I did one more test, try creating `$('#frmSurvey').click(function ()` and there my `$(this)` version works. So as you say ajaxForm create a different context as the one i was expecting. – Juan Carlos Oropeza Mar 17 '15 at 16:07
In other note I just pass the 200 point barrier thanks to this question. So happy :). – Juan Carlos Oropeza Mar 17 '15 at 16:11
@JuanCarlosOropeza no problem and congratulations! I had a quick look at the plugin and it looks like `this` would be the jQuery ajax xhr object. – Klors Mar 17 '15 at 16:25

Is using THIS more efficent than using the selector?

1 Answers1