使用jQuery動態地在下拉框中選擇一個選項

Question

我有一個給定的下拉框。

<select id="selector_states">
    <option value="kl">Kerala</option>
    <option value="tn">Tamil Nadu</option>
    <option value="ka">Karnataka</option>
    <option value="ap">Andhra Pradesh</option>
</select>

我需要在下拉框中找到帶有給定選項值的文本。 那就是我在變量中說“ kl”

var state_code="kl"

使用此我需要在選擇框中找到文本。 我是python開發人員，對jquery不太熟悉。 有人可以幫助我找到解決方案嗎？

Answer 1

將變量傳遞給.val()方法。 jQuery處理其余部分：

var state_code = 'kl';
$('#selector_states').val(state_code);

請注意，由於kl仍然是默認選項，因此您在這里看不到任何區別。

的jsfiddle

Answer 2

你可以做：

var option = $("#selector_states option[value=" + state_code + "]");

這將為您提供帶有存儲在state_code的匹配值的選項

Answer 3

這是您要問的嗎？

var stateCode = "kl";
var result = $("#selector_states").find("option[value=" + stateCode + "]").text();
alert(result);

以上是做什么的：

查找id為select_states // $（“＃selector_states”）的元素（注意：這將返回jQuery對象）
從其子DOM元素中找到那些屬於選項 1且屬性值等於此 $（jQuery對象）.find（“ option [ value = thisOne ]（其中，您的情況是stateCode變量）。
找到此元素並獲取其text（） （或您可以鍵入html），例如： < html element> 我是文本 </html element> ，其中html元素可能是<div> ， <ul> ， <li>等等

如果您對我上面寫的內容不太熟悉，建議您閱讀一些有關DOM樹以及如何使用JavaScript對其進行操作的知識。 （最多大約需要10分鍾）

我建議https://developer.mozilla.org/zh-CN/docs/Web/API/Document_Object_Model/Introduction

並且請記住上面鏈接中的示例是純JavaScript腳本，jQuery在幕后做了同樣的事情，只是糖語法：）（並記住$（'html element'）使它成為jQuery對象！您可以像在$（“＃selector_states”）上方那樣鏈接函數，將我們的DOM元素轉換為jQuery對象。jQuery對象現在實現了.find函數。（也包括.text（） ）。

Answer 4

 // Select by value $('select[name="options"]').find('option[value="3"]').attr("selected",true); // Select by text //$('select[name="options"]').find('option:contains("Third")').attr("selected",true);

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> <html> <body> <select name="options"> <option value="1">First</option> <option value="2">Second</option> <option value="3">Third</option> </select> </body> </html>

Answer 5

做這個

警報（$（ 'selector_states'）VAL（））;

使用jQuery動態地在下拉框中選擇一個選項

問題描述

5 個解決方案

解決方案1
2 2014-10-23 13:56:22

解決方案2
0 2014-10-23 13:55:08

解決方案3
0 已采納 2014-10-23 14:05:22

解決方案4
0 2017-09-11 14:01:46

解決方案5
-1 2014-10-23 14:11:38

使用jQuery動態地在下拉框中選擇一個選項

問題描述

5 個解決方案

解決方案1 2 2014-10-23 13:56:22

解決方案2 0 2014-10-23 13:55:08

解決方案3 0 已采納 2014-10-23 14:05:22

解決方案4 0 2017-09-11 14:01:46

解決方案5 -1 2014-10-23 14:11:38

解決方案1
2 2014-10-23 13:56:22

解決方案2
0 2014-10-23 13:55:08

解決方案3
0 已采納 2014-10-23 14:05:22

解決方案4
0 2017-09-11 14:01:46

解決方案5
-1 2014-10-23 14:11:38