3

我对某些代码有疑问。基本上我想从<select>使用 jQuery 中删除第一个选项，它正在工作，但仅适用于第一个选择。如果我有 3 个下拉菜单，则代码仅适用于第一个。我尝试使用.each，但老实说，我真的不知道在哪里，这甚至会有所帮助。这是一个html：

      <select class="checkb" name="gender">
     <option disabled value="">Gender</option>
     <option value="male">Male</option>
     <option value="female">Female</option>
  </select>  

  <select class="checkb" name="age">
     <option disabled value="">Age</option>
     <option value="under 13">Under 13</option>
     <option value="13-17">13-17</option>
     <option value="18-24">18-24</option>
     <option value="25-44">25-44</option>
     <option value="45-64">45-64</option>
     <option value="65+">65+</option>
  </select>  

  <select class="checkb" name="cinema">
     <option disabled value="">Select your cinema</option>
     <option value="001">Cinema 1</option>
     <option value="002">Cinema 2</option>
     <option value="003">Cinema 3</option>
  </select>

这是jQuery：

    $(".checkb option:first").attr('hidden','hidden');

它完美地隐藏了“性别”文本，但不隐藏“年龄”和“选择你的电影”。

先感谢您。

4

2 回答 2

5

好吧，:first告诉 jquery 只作用于第一个孩子（在这种情况下是类的第一个元素），所以删除它并使你的代码如下所示：

$('.checkb').each(function () {
  $(this).children('option:first').attr('hidden','hidden');
});
于 2012-08-15T10:58:59.187 回答
5

该选择器将选择<option>它找到的第一个元素，该元素位于具有 class 的元素中.checkb，这就是它仅从 first 中删除第一个<option>的原因<select>。

您可以改为使用:nth-child()选择器来获取属于该类<option>的第一个子元素的所有元素：<select>

$('.checkb option:nth-child(1)').attr('hidden', 'hidden');

编辑：我很好奇解决此问题的三种方法的效率（当前答案中建议的两种方法，以及克里斯托弗肯尼答案的第三种方法），因此决定对其进行测试。你可以在这里看到结果。

于 2012-08-15T10:59:37.267 回答