更改沒有ID /類別的“選擇選項”值

Question

我想在此網站上更改其顯示下拉菜單的方式。

http://i.stack.imgur.com/Wu718.jpg

我想使它的默認值是“待售物品”，而不是“論壇主題”

這是他們的源代碼。

       <select name="sec" style="margin-top:5px;width:138px;">

            <option value="topics">Forum Topics</option>

            <option value="s">Items for Sale</option>

            <option value="b">Want to Buys</option>

            <option value="users">Members</option>

       </select>

因為我並不真正在乎它的外觀，所以我只想將value =“ topics”更改為value =“ s”，即使不更改文本也是如此。

我已經閱讀了一些教程，但是他們大多使用ID和類作為選擇器，在這種情況下，我該如何從他們網站上的其他許多對象中選擇此Select並更改其值。

Answer 1

您可以使用：

 $('select[name=sec]').val('s'); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script> <select name="sec" style="margin-top:5px;width:138px;"> <option value="topics">Forum Topics</option> <option value="s">Items for Sale</option> <option value="b">Want to Buys</option> <option value="users">Members</option> </select> 

我認為這就是您在以下評論中描述的內容：

 var dropdown = $('select[name=sec]'); // change the s option to items dropdown.find('option[value=s]').attr('value', 'items'); // change the topics option to s dropdown.find('option[value=topics]').attr('value', 's'); // change the dropdown's value to s // (first option should continue to be selected because its value is now s) dropdown.val('s'); // (this is for demo purposes only) dropdown.after($("<div>").text("New HTML is: " + dropdown[0].outerHTML)); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script> <select name="sec" style="margin-top:5px;width:138px;"> <option value="topics">Forum Topics</option> <option value="s">Items for Sale</option> <option value="b">Want to Buys</option> <option value="users">Members</option> </select> 

Answer 2

您可以使用名稱或任何其他屬性。

對於CSS

select[name="sec"]

或jquery

$('select[name="sec"]').

Answer 3

從瀏覽器中查看DEMO檢查元素以查看更改，您可以使用select[name=sec]選擇選擇下拉列表，然后使用option:first選擇第一個選項

 $('select[name=sec] option:first').val('s');

如果您需要更改任何選項，只需使用.eq()

$('select[name=sec] option').eq(0).val('s');  // eq(0) for the first option element . eq(1) for the second option element ...

Answer 4

如果要選擇其他選項，請使用以下代碼：

$('select[name="sec"]').find('option:selected').removeAttr('selected');
$('select[name="sec"]').find('option[value="s"]').attr('selected','selected');

該腳本刪除默認選擇（第一個選項），然后選擇具有“ s”值的選項。 對於演示：

 $('select[name="sec"]').find('option:selected').removeAttr('selected'); $('select[name="sec"]').find('option[value="s"]').attr('selected','selected'); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script> <select name="sec" style="margin-top:5px;width:138px;"> <option value="topics">Forum Topics</option> <option value="s">Items for Sale</option> <option value="b">Want to Buys</option> <option value="users">Members</option> </select> 

您必須在DOM中找到此元素。 為此，您應該找到具有ID或CLASS屬性的第一個父容器元素。 通過使用.find（）方法，可以從該元素中搜索所需的元素。 如果有更多具有“ sec”值的名稱屬性的元素，則應構建一個查找鏈，以查找所需的分隔符。 為此，您可以使用以下功能模板：

$(#CONTAINER_ID).find(.SUBCONTAINER_CLASS).find(ELEMENT_TYPE);
$(#CONTAINER_ID).find(SUBCONTAINER_TYPE).find(OTHER_SUBCONTAINER_TYPE:eq(X));