添加/刪除/從選擇輸入

這裏更新選項是什麼，我已經開始做的：http://jsfiddle.net/nd9ny/添加/刪除/從選擇輸入

現在它不工作，我希望它。

我想在每次添加新選擇輸入或刪除輸入時更新選項。

例如，我們有我們的這些選項第一選擇輸入：

<select> 
    <option value="1"></option> 
    <option value="2"></option> 
    <option value="3"></option> 
    <option value="4"></option> 
</select>

當我添加新的輸入到我的網頁，我想我的功能更新所有輸入和刪除從新選擇的選項他們。

<select> 
    <option value="1" selected></option> 
    <option value="3"></option> // The second one is removed 
    <option value="4"></option> 
</select> 

<select> 
    <option value="2" selected></option> // The first one is removed 
    <option value="3"></option> 
    <option value="4"></option> 
</select>

然後，如果我刪除第一輸入，第二個就變成了：

<select> 
    <option value="1"></option> 
    <option value="2" selected></option> 
    <option value="3"></option> 
    <option value="4"></option> 
</select>

純JavaScript代碼的需要。

來源

2012-09-19 Hypn0tizeR

您可以嘗試以下解決方案：

- CSS：

.hidden { 
    display: none; 
}

- JS功能：

function hide_selected(el) { 

    var index = el.selectedIndex; 

    // Show every options 
    for(var i=0; i<el.length; i++) 
     el[i].className=""; 

    // Hide the selected one 
    el[index].className="hidden"; 
}

- HTML例如：

<body> 
    <select onchange="javascript:hide_selected(this);"> 
     <option value="1" class="hidden" selected="selected">1</option> 
     <option value="2" class="">2</option> 
     <option value="3" class="">3</option> 
     <option value="4" class="">4</option> 
    </select> 
</body>

注意：此功能已經過Firefox測試，您可能需要檢查此功能是否適用於其他瀏覽器。

希望這會有幫助

來源

2012-09-19 12:05:42 Littm

這是非常好的主意，只是隱藏他們:) – Hypn0tizeR

添加/刪除/從選擇輸入

回答

相關問題