1

As of jQuery 3.4 :eq is being deprecated and instead .eq() should be used.

Here is a code snippet which has multiple jQuery selectors which are using :eq. How can I break multiple selectors to use .eq() instead of :eq?

$(this).find('th.draggable:visible:eq(' + n + ') span,td:visible:eq(' + (g.actionSpan + n) + ') span'));
Rory McCrossan
  • 331,213
  • 40
  • 305
  • 339
Yash Raj Bothra
  • 19
  • 1
  • 6
  • 3
    Chain the selectors? `.find('th.draggable:visible').eq(n).find('...`? – evolutionxbox Jan 17 '20 at 16:41
  • 2
    simpler logic/selectors. Think about what the goal of this code is and how it can be achieved with far less work rather than trying to come up with a 1:1 replacement of an old selector. – Kevin B Jan 17 '20 at 16:47
  • If you show the markup perhaps we can think of a simpler selection? – mplungjan Jan 17 '20 at 16:53
  • 1
    ^^^ Depending upon the actual html, a solution could potentially use one of the `:nth-*` css selectors instead of `:eq()` – Taplar Jan 17 '20 at 16:55

2 Answers2

1

Something like this using add()

const $th = $('th.draggable:visible',this).eq(n);
const $td = $('td:visible',this).eq(g.actionSpan + n);
const $spans = $('span',$th).add('span',$td)
mplungjan
  • 169,008
  • 28
  • 173
  • 236
0

To do the logical OR, you select the first elements, then using add() you select the second elements to include them in the first's results.

var $secondDivAndSpanInput = $('div').eq(1).find('input').add(
  $('span').eq(1).find('input')
);

console.log( $secondDivAndSpanInput.get() );
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div><input type="text" name="divs" value="1"></div>
<div><input type="text" name="divs" value="2"></div>
<div><input type="text" name="divs" value="3"></div>

<span><input type="text" name="spans" value="1"></span>
<span><input type="text" name="spans" value="2"></span>
<span><input type="text" name="spans" value="3"></span>
Taplar
  • 24,788
  • 4
  • 22
  • 35