Question

我有这段代码

<div id="drop-down">
<table>
<tbody><tr><td align="left"><select name="selector" size="1">
<option value="Red" selected="">Red</option>
<option value="Blue">Blue</option>
<option value="Pink">Pink</option>
</select>
</td></tr>
</tbody>
</table>
</div>

我想定位其中的选项。我该怎么做？

我尝试了$('#drop-down>table>tr>td>select')，而$('#drop-down table tr td select')无效。选择名称总是不同的，因此我无法引用该名称。

Answer 1

使用给定的标记，$('#drop-down > table > tbody > tr > td > select > option')和$("#drop-down select > option")将起作用。

要选择每个option使用香草js，请使用[0]，[1]等，即

$("#drop-down select > option")[1].value; //"Blue"

要在元素上使用jQuery，请使用.eq(0)，.eq(1)等，即

$("#drop-down select > option").eq(1).attr('value'); //"Blue"

Answer 2

如果您指定名称，ID，类或任何其他属性，您最好的选择是通过索引选择options ：

$('#drop-down table tr td select option').eq(0) // will return the first option

请注意： 1将返回第二个，2将返回第三个，依此类推。

Answer 3

$('#drop-down').contents().find('select').val();

演示：

http://jsfiddle.net/R7C4H/

Answer 4

确保已将代码包裹在document.ready

中

$(document).ready(function(){
    console.log($('#drop-down select')); // gets the select
    console.log($('#drop-down select option:selected').val()); // get the selected options value
    console.log($('#drop-down select option:eq(1)').val()); // get the option by its index (begins at 0)
});

Fiddle

Answer 5

试试这个：

$('#drop-down select').toggleClass('gotcha');

表jquery中的目标元素

5 个答案: