Correct way to add variable and selectors to a not function - jquery

Question

I have checked a few answers on SO and I think my syntax is correct, but something is not working correctly.

I am trying to create an array of jquery selectors mixed with variables and store them in a not() function.

I have this fiddle to demonstrate.

The second line of the function is not working:

var trigger = $('mainNav li:eq(0) a');
var headerLinks = $('#header a').not('.control a', + trigger);

My first thought was that #header a has more precedence over .control a in css terms. But changing classes and ID's doesn't seem to work.

Similarly I have a simpler var further in my code:

var content = $('.content');
var added = $('.extraList', + content);

In the console added is only returning the extraList selector.

1 Does the not function work differently to other jquery selectors? I was hoping to see the array of all the elements selected and/or filtered in the console

2 Is there a way to store the vars and selectors in a standard array and call that? I don't know how this would look exactly as jquery would need to interpret it, but something like this:

var arr = ['.control a', headerLinks, content, '.post'];

I realise that is mixing types but I am not sure how to pass both jquery variables and selectors into the same array, if it is possible.

Satpal · Accepted Answer · 2015-03-04 11:57:00Z

1

For code var headerLinks = $('#header a').not('.control a', + trigger);

You can simply use chaing like

var headerLinks = $('#header a').not('.control a').not(trigger);

OR

var trigger = $('.control a, #mainNav li:eq(0) a'); //I am using here #mainNav
var headerLinks = $('#header a').not(trigger);

For var added = $('.extraList', + content);

You can use .add()

Create a new jQuery object with elements added to the set of matched elements.

var added = $('.extraList').add(content);

answered Mar 4, 2015 at 11:57

Satpal

134k13 gold badges168 silver badges171 bronze badges

Sign up to request clarification or add additional context in comments.

7 Comments

lharby Over a year ago

Thank you @Satpal I did try chaining the not functions but that did not seem to work. See updated fiddle: jsfiddle.net/lharby/js5okk49/4

Satpal Over a year ago

@lharby, .control is not child of header so $('#header a').not('.control a') will still refer to $('#header a'). what are you trying to acheive?

lharby Over a year ago

I am trying to populate a list of links that should not trigger a certain function. The other links that are not specified should trigger the function.

lharby Over a year ago

OK well the add function works. Unfortunately the control a links are still logging 'was clicked' to the console when they should have been excluded. Ah OK, not(): Remove elements from the set of matched elements. So it runs the first selector as the parent. Thank you.

Satpal Over a year ago

@lharby, See jsfiddle.net/mbe547o7 this will resolve your problem, main changes is var headerLinks = $('#header a').not(trigger);var contentLinks = $('.post a').not('.control a');

|

lharby · Accepted Answer · 2015-04-21 10:51:39Z

Thanks to @Satpal. Your answer definitely helped me, but here is what I did.

Store an array of jquery selectors to later exclude from the function, I can keep adding to or edit this variable. (I think this is neater as it has separated out the code a little more and it circumvents the parent/child issue):

var exclude = $('#mainNav li:eq(0) a, .control a, .social-links a');

Create another set of links to include in the function:

var headerLinks = $('#header a');
var contentLinks = $('.post a');

Merge selectors which are going to be used to trigger the function and also add the excluded selectors:

var merge = $.merge(headerLinks, contentLinks).not(exclude);

Now the click function:

merge.on('click',function(){});

Should fire for the links that I want, and not the ones that I don't.

I would still like to know how to store an array of jquery selectors and variables in a standard javascript array.

Updated fiddle: http://jsfiddle.net/lharby/gk7bmzqh/1/

Collectives™ on Stack Overflow

Correct way to add variable and selectors to a not function - jquery

2 Answers 2

7 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

7 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related