如何使用jquery mobile更新2个具有相同选项的选择框

Question

使用jquery/jqm我需要为2个选择框添加一个选项。我可以得到一个更新，但没有更新。我如何获得另一个更新。 注意名称/编号为 中的S无论.append列出的是哪个。第二个是已更新的。

HTML：

<input type="button" name="Goal_WeightVar" id="Goal_WeightVar" value="doit"> 
<br> 
<select name="grouplist" id="grouplist"> 
    <option value="choose">Choose a Group</option> 
    <option value="#groupid#">option1</option> 
</select> 
<select name="groupslist" id="groupslist"> 
    <option value="choose">Choose a Group</option> 
    <option value="#groupid#">option1</option> 
</select> 

脚本：

$('#Goal_WeightVar').live('click', function() { 
    var newgroupcode = $('<option value="11">11<option>'); 
    $('#groupslist').append(newgroupcode).trigger("create"); 
    $('#grouplist').append(newgroupcode).trigger("create"); 
    $('#groupslist').selectmenu(); 
    $('#groupslist').selectmenu('refresh'); 
    $('#grouplist').selectmenu(); 
    $('#grouplist').selectmenu('refresh'); 
}); 

的jsfiddle http://jsfiddle.net/ThMnq/1/

Answer 1

您需要使用clone()使你的对象的副本，并以不同的对象作为一个对象添加能不存在于两个地方。

Live Demo

$('#Goal_WeightVar').live('click', function() { 
    var newgroupcode = $('<option value="11">11<option>'); 
    $('#groupslist').append(newgroupcode).trigger("create"); 
    $('#grouplist').append(newgroupcode.clone()).trigger("create");  
});