當選擇其他項目時，從選擇框中添加和刪除選項

Question

我已經使用jsfiddle上的特色代碼（下面）。我遇到的問題是，如果我將選項值更改爲與文本值不同，則會將值添加到更改的文本字段中。

jQuery(function(){ 
      jQuery('.selbox').change(function(){ 
      var val = jQuery(this).val(); 

      var sel = jQuery(this); 

      if(val != "") 
      { 
      if(sel.data("selected")) 
      { 
      var oldval = sel.data("selected"); 


      sel 
      .siblings('select') 
      .append(jQuery('<option/>').attr("value", oldval).text(oldval)); 
      } 

      sel 
      .data("selected", val) 
      .siblings('select') 
      .children('option[value=' + val + ']') 

      .remove(); 
      } 
      else if(val == "") 
      { 
      if(sel.data("selected")) 
      { 
      var oldval = sel.data("selected"); 


      sel 
      .removeData("selected") 
      .siblings('select') 
      .append(jQuery('<option/>').attr("value", oldval).text(oldval)); 
      } 
      }    
      }); 
      }); 

我使用的代碼

<option value="1">text here</option> 

請看這裏提供原代碼http://jsfiddle.net/BUuZv/2/

Answer 1

而不是刪除他們，加入他們，你可以簡單地hide/show他們像this fiddle

$(function() { 
    $('.selbox').change(function() { 
     var val = $(this).val(); 
     var sel = $(this); 

     if (val != "") { 
      if (sel.data("selected")) { 
       var oldval = sel.data("selected"); 
       sel.siblings('select').find('option[value="' + oldval + '"]').show() 
      } 

      sel.data("selected", val).siblings('select').children('option[value=' + val + ']').hide(); 
     } 
     else { 
      if (sel.data("selected")) { 
       var oldval = sel.data("selected"); 
       sel.removeData("selected").siblings('select').find('option[value="' + oldval + '"]').show() 
      } 
     } 
    }); 
});