Javascript/jQuery：確保添加到下拉菜單的唯一選項

我有一個HTML下拉菜單以及允許用戶向菜單添加新選項的文本元素。我想確保所添加的每個選項都是唯一的。以下兩行是我認爲有效的第一個選項（對於所有選項，選項值= innHTML）。我想知道是否有更優雅的解決方案 - 第二條線看起來很笨重。它也不處理new_name字符串中的空格。Javascript/jQuery：確保添加到下拉菜單的唯一選項

var new_name = document.getElementById("preset_name").value 
var unique_name = $("option[value="+new_name+"]").length === 0 ? true : false

來源

2013-07-31 LiavK

只是出於好奇，爲什麼你使用普通的JavaScript和jQuery？ – putvande

看起來沒問題。我敢打賭三元是不需要的。 'unique_name = $（「option [value =」+ new_name +「]」）。length === 0'應該自己指定true或false。 – 2013-07-31 22:37:20

你需要這樣的東西嗎？

HTML：

<select id="myselect"> 
    <option value="volvo">Volvo</option> 
    <option value="saab">Saab</option> 
    <option value="mercedes">Mercedes</option> 
    <option value="audi">Audi</option> 
</select> 
<input id="newoption" type="text" /> 
<button id="check">Check</button>

的jQuery：

$(document).ready(function() { 
    $("button#check").click(function() { 
     var newOpt = $("input#newoption").val(); 
     $("#myselect option").each(function(){ 
      var text = $(this).val(); 
      if(newOpt.length>0 && text.indexOf(newOpt)!=-1){ 
       console.log("already present!"); 
      } 
     }); 
    }); 
});

jsfiddle

來源

2013-07-31 23:23:56

是的，這應該工作。不過，我猜想我想知道的是，如果有一種非常簡潔的方式來獲取選項值集合，則可以進行成員資格測試。 – LiavK

結合對這一問題的兩點意見，你可以精簡到1行：

var unique_name = $("option[value="+$("#preset_name").val()+"]").length === 0;

你不需要三元，作爲===導致true或false值。除非您再次需要測試值，否則您甚至不需要將其存儲在變量中 - 您可以使用jQuery來檢索它。

來源

2013-07-31 22:44:19

Javascript/jQuery：確保添加到下拉菜單的唯一選項

回答

相關問題