CODEWITHSUNDEEP
javascriptjquery
yaochiqkl
yaochiqkl

Reputation: 489

jquery selector using the 'not:' twice

<input type="text" class="incorrect">
<input type="text" class="correct">
<input type="text" class="defalut">
<input type="text" class="correct">
<input type="text" class="incorrect">
<input type="text" class="">

I'm using jquery . I mean , now I'm focused on the first input (which has class of incorrect) . I want to get the next input that has neither class=default nor class=correct . How to realise it ? I try 

input:not(.correct):not(.defalut)

or

input:not(.correct .defalut)

But it seems not working ! Thx a lot!

Upvotes: 0

Views: 510

Answers (2)

rrk
rrk

Reputation: 15846

Seperate classnames using comma. If you want the focus to be on elements other than the first one, and does not have class 'correct' or 'defalut', then use the following. Here I've used filter() function and slice() function to not select first element.

Here 

var count = $('input:not(.correct, .defalut)').length;
alert( "Number of inputs not have classnames 'correct' or 'defalut' : " + count );
$('input').slice(1).filter(':not(.correct, .defalut)').first().focus();
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" class="incorrect">
<input type="text" class="correct">
<input type="text" class="defalut">
<input type="text" class="correct">
<input type="text" class="incorrect">
<input type="text" class="">

Upvotes: 1

guest271314
guest271314

Reputation: 1

now I'm focused on the first input (which has class of incorrect)

Try using :first to select first .incorrect input element , next siblings selector , :not() with selectors .correct, .default , :first again to select first element that does not have class .correct or .default

Note "default" is spelled "defalut" at third input element , adjusted at html at stacksnippets to "default"

$(".incorrect:first ~ input:not(.correct, .default):first")
.css("border", "2px solid sienna")
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<input type="text" class="incorrect">
<input type="text" class="correct">
<input type="text" class="default">
<input type="text" class="correct">
<input type="text" class="incorrect">
<input type="text" class="">

Upvotes: 1

Related Questions