我想追加与通过OPTGROUP下拉

Question

我想追加由OPTGROUP &删除我能够通过使用下面的js代码移除，但不能够通过OPTGROUP追加可以请你检查我的js小提琴

JS删除代码

$j("#shipping_method optgroup[label='Free Shipping']").remove(); 

<fieldset> 
    <select name="shipping_method" id="shipping_method" style="width:250px;" class="required-entry"> 
     <option value="">Please select a shipping method...</option> 
     <optgroup label="Free Shipping" style="font-style:normal;"> 
     <option value="freeshipping_freeshipping"> 
      Standard Shipping (SmartPost) (2 - 7 Business Days) - $0.00              
     </option> 
     </optgroup> 
     <optgroup label="FedEx" style="font-style:normal;"> 
     <option value="fedex_FEDEX_GROUND"> 
      Ground (2 - 4 Business Days) - $18.07              
     </option> 
     <option value="fedex_FEDEX_2_DAY"> 
      2-day (2 - 3 Business Days) - $30.62              
     </option> 
     <option value="fedex_STANDARD_OVERNIGHT"> 
      Standard Overnight (1 - 2 Business Days) - $81.34              
     </option> 
     </optgroup> 
    </select> 
</fieldset> 
<a href="#" class="reset-signature" style="display: none">Clear Shipping Selection</a> 
<p class="actions"> 
    <button id="update_shipping_method_submit" type="submit" class="button" style="display: none;"><span><span>Update Shipping Method</span></span></button> 
</p> 

https://jsfiddle.net/7k6evkt8/ 

Answer 1

尝试下面的一个例子先做克隆选择&外面然后取出选项&当你需要追加外克隆选项

$("#shipping_method optgroup[label='Free Shipping']").clone("optgroup[label='Free Shipping']").insertAfter("#shipping_method_form"); 
    $("#shipping_method optgroup[label='Free Shipping']").remove(); 
    $(".box-content .fedex").appendTo("#shipping_method"); 

希望这有助于！

Answer 2

你可以试试这个：

$("#shipping_method optgroup[label='Free Shipping']").remove(); 
var optgroup = $('<optgroup>'); 
optgroup.attr('label', 'testing'); 
var option = $("<option></option>"); 
option.val('aaaa'); 
option.text('aaaa'); 
optgroup.append(option); 

$("#shipping_method").append(optgroup);