使用jQuery在div中获得特定的下拉列表

Question

I have multiple dropdown in a div. This is automatically generated. I have done that work. But i need to get the nth dropdown. Please help me to get this.

$('#show_label_categories')[1].find('select').each(function () {

});

<div id="show_label_categories">
  <select name="search_category" class="form-control parent">
    <option value="-1" selected="selected">-- Select --</option>
    <option value="1">Tutorials</option>
    <option value="2">Demos</option>
    <option value="3">Entertainment</option>
    <option value="4">Real Estate</option>
    <option value="5">Web Development</option>
    <option value="6">Browsers</option>
    <option value="43">Laptop</option>
    <option value="46">1</option>
  </select>
  <select name="search_category" class="form-control parent">
    <option value="-1" selected="selected">-- Select --</option>
    <option value="12">PHP demos</option>
    <option value="13">jQuery demos</option>
  </select>
  <select name="search_category" class="form-control parent">
    <option value="-1" selected="selected">-- Select --</option>
    <option value="36">Good Demos</option>
  </select>
</div>

Answer 1

You can use the :eq(n) selector, so for the second select :

$('select:eq(1)');

n is the zero-based index.

An example to color it red:

 $('#show_label_categories select:eq(1)').css('color', 'red'); alert('Length: ' + $('#show_label_categories select:eq(1)').length); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div id="show_label_categories"> <select name="search_category" class="form-control parent"> <option value="-1" selected="selected">-- Select --</option> <option value="1">Tutorials</option> <option value="2">Demos</option> <option value="3">Entertainment</option> <option value="4">Real Estate</option> <option value="5">Web Development</option> <option value="6">Browsers</option> <option value="43">Laptop</option> <option value="46">1</option> </select> <select name="search_category" class="form-control parent"> <option value="-1" selected="selected">-- Select --</option> <option value="12">PHP demos</option> <option value="13">jQuery demos</option> </select> <select name="search_category" class="form-control parent"> <option value="-1" selected="selected">-- Select --</option> <option value="36">Good Demos</option> </select> </div> 

Answer 2

您可以使用

$("#show_label_categories").children("select:nth(1)");