如何綁定下拉基礎上選定的文本

Question

我有一個下拉列表如下：

<select name="ddTblrule" id="ddTblrule" class="controlFont controlWidth"> 
    <option value="Abc">Abc [ abc ]</option> 
    <option value="Abc">Abc [ abc1 ]</option> 
    <option value="Abc">Abc [ abc2 ]</option> 
    <option value="Abc Associations">abc Associations [ abcas ]</option> 
</select> 

由於下降的值下降是相同的（應該是一樣的，值依賴於其他文本框）。我有一個網格，其中包含選定的下拉文本。當用戶點擊編輯按鈕時，我必須顯示在下拉菜單中選擇的相應文本，我正在使用下面的代碼。

var ruleObj = data.find('td:eq(3)').text(); 
$("#ddTblrule option").removeAttr("selected"); 
$("#ddTblrule option").filter(function() { 
    return this.text == ruleObj; 
}).attr('selected', true); 

但是數據在下拉菜單中顯示不正確。請幫助

Answer 1

根據你的問題，我認爲你正在尋找像下面這樣的東西。

$('#edit').click(function() { 
 
    var ruleObj = 'Abc [ abc2 ]'; 
 
    $("#ddTblrule option").filter(function() { 
 
     return $(this).text() == ruleObj; 
 
    }).prop('selected', true); 
 
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<select name="ddTblrule" id="ddTblrule" class="controlFont controlWidth"> 
 
    <option value="Abc">Abc [ abc ]</option> 
 
    <option value="Abc">Abc [ abc1 ]</option> 
 
    <option value="Abc">Abc [ abc2 ]</option> 
 
    <option value="Abc Associations">abc Associations [ abcas ]</option> 
 
</select> 
 

 
<button id="edit">Edit</button>