chobo2 chobo2 - 6 months ago 48
jQuery Question

Multiple selector chaining in jQuery?

Normally when I use a class as a selector I try to use an "id" selector with it so it does not search through the entire page but only an area where the class would be.

However I have a partial view with code in it. This partial view (common code) gets wrapped around a form tag.

I have:

<form id="Create">
// load common code in from partial view

<form id="Edit">
// load common code in from partial view

Now in this common code I need to attach a plugin to multiple fields so I would do

$('#Create .myClass').plugin({ options here});

$('#Edit .myClass').plugin({options here});

So it's pretty much the same code. I am wondering if there is a way to make it look for either of the id's?


I am having problems with it when I have variables for my selectors

my.selectors =
A: '#Create',
B: '#Edit',
Plugin: ' .Plugin'

$(selector.A+ selectors.Plugin, selector.B+ selectors.Plugin)

Does not seem to run.


You can combine multiple selectors with a comma:

$('#Create .myClass,#Edit .myClass').plugin({options here});

Or if you're going to have a bunch of them, you could add a class to all your form elements and then search within that class. This doesn't get you the supposed speed savings of restricting the search, but I honestly wouldn't worry too much about that if I were you. Browsers do a lot of fancy things to optimize common operations behind your back -- the simple class selector might be faster.