2011-01-23 7 views
1

私は私の選択ボックスは、いくつかのオプションなしで、ループJavascript/jQueryでオプションを削除した選択ボックスをリセットすることはできますか?

$("#day option:last").remove(); 

で次のコマンドを使用していますが、コマンドは2または3回実行されている場合。

したがって、私は関数の始めにあったように選択ボックスをリセットする必要があります。

助けが必要ですか?

+0

残りの機能を表示したい – PetersenDidIt

答えて

0

最初は正しく理解できませんでした。 しかし、単純な解決策は、要素を削除して複製を行うか、追加のコピーを保持する代わりに.hide()を使用することです。 リセット機能はoption要素の.show()を実行します。

1

jQueryの.clone()http://api.jquery.com/clone/methodを使用して、ドロップダウンリストのコピーを保持することをお勧めします。また、値をリセットする場合はリストを置き換えるか、コピーして既存のドロップダウンリストに追加します。

ここでは、上記で説明したjQueryのクローンを使用したサンプルを示します。

<html> 
<head> 
<script src="jquery.js" type="text/javascript"> 
</script> 
<script> 

$(document).ready(function(){ 
//clone the select list 
var optionlist = $("#options").clone(); 

//add the remove function event handler to a link 
$("#remove").click(function(){ 

$("#options option:last").remove(); 

return false; //don't refresh the page 

}); 

// add the reset click event handler to the reset link 
$("#reset").click(function(){ 

//replace the select list with the original clone 
$("#options").replaceWith(optionlist); 

//clone the new list into the original optionlist variable 
optionlist = $("#options").clone; 

return false; //don't refresh 

}); 

}); 

</script> 
</head> 
<body> 
<select id="options" multiple="true" > 
<option value="1">1</option> 
<option value="2">2</option> 
<option value="3">3</option> 
</select> 
<a id="remove" href="#" >remove</a> 
<a id="reset" href="#">reset</a> 
</body> 
</html> 
2

あなたが変更を加える前select要素のクローンを作成することができます:あなたはそれを復元したい場合、

var copy = $('#day').clone(); 

後半だけ古いもので、現在のselectを置き換える:

$('#day').replaceWith(copy); 
関連する問題