在选择元素中找到一个选项并选择它

Question

我相信我的问题与语法相关。

我有一个页面，其上有标签（按钮）。用户应该能够点击其中一个标签来编辑它的名字。

也在同一页上，我有一个选择列表，在其中跟踪所有更改。我点击标签按钮时出现问题，并且应该动态选择列表中的相应选项。我试过几件事情，这是我最新的尝试：

HTML

 <!-- tags container --> 
     <div class="container_12"> 
      <div class="grid_2"><img src="images/spacer.png" /></div> 
      <div id="content" class="grid_8"> 
       <button name="PHP" class="tag-button" onclick="edit(this)">PHP</button> 
      </div> 
      <div class="grid_2"><img src="images/spacer.png" /></div> 
     </div> 
     <!-- tags container end --> 

     <!-- action buttons container --> 
     <div class="container_12 action-bar"> 
      <div class="grid_4"><img src="images/spacer.png" /></div> 
      <div id="action-add"> 
       <input type="text" name="newTag" id="newTag" /> 
       <input type="button" id="add" value="Add tag" /> 
      </div> 
      <div class="grid_4"><img src="images/spacer.png" /></div> 
      <div id="action-edit"> 
       <input type="text" name="editTag" id="editTag" /> 
       <input type="button" id="update" value="Update tag" /> 
      </div> 
     <!-- action buttons container end --> 
     </div> 

     <!-- Real Time list container --> 
     <div class="container_12"> 
      <div class="grid_4"><img src="images/spacer.png" /></div> 
      <select id="insertString" multiple> 
       <option value="0">PHP</option> 
      </select> 
     </div> 
     <!-- real time list container end --> 

使用Javascript/jQuery的：

//function edit: places the tag button info in textbox 
    function edit(element) 
    { 
      var name = $(element).attr('name'); 
      //add the tag name to the editTag textbox 
      $('#editTag').val(name); 
      //find in the list the corresponding option, and select it 
      $('#insertString').find('option: contains("' + name + '")').attr("selected", true); 
    } 

的代码，我很担心，现在的部分，是“找到列出相应的选项，并选择它。“我似乎无法让它选择所有选项。

任何帮助，将不胜感激。

Answer 1

var previous = "Gateway 1", edited = "world"; 
$('#insertString option:contains("' + previous +'")').text(edited); 
$('#insertString option:contains("'+ edited + '")').attr('selected', true); 

JSFiddle

Answer 2

//function edit: places the tag button info in textbox 
    function edit(element) 
    { 
      var name = $(element).attr('name'); 
      //add the tag name to the editTag textbox 
      $('#editTag').val(name); 
      //find in the list the corresponding option, and select it 
      $('#insertString').val('"+name+"'); 
    } 

Answer 3

我建议如下：

$('#insertString').find('option:contains("'+ name + '")').attr("selected", true); 

Answer 4

$("#insertString option[value='" + name "']").prop('selected', true);