-3

親選択ボックスの選択肢の1つの値に応じて子選択ボックスが作成されるテスト入力フォームがあります。親選択ボックスで他の選択肢を選択すると、子が削除されます。機能しますが、一度だけです。子選択ボックスが 2 度目に作成された場合、他の選択肢のいずれかを選択しても削除されません。

コードは次のとおりです。

<html> 
<SCRIPT LANGUAGE="JavaScript">
function createtext(){
var var1 = document.getElementById('s');
var var2=var1.value;

if (var2 == "American Express")
{
var selector = document.createElement('select');
selector.id = 'gift';
selector.name = 'gift';
selector.size = '2';
myform.appendChild(selector);

var option = document.createElement('option');
option.value = '0';
option.appendChild(document.createTextNode('Gift card'));
selector.appendChild(option);

option = document.createElement('option');
option.value = '1';
option.appendChild(document.createTextNode('Fully owned card'));
selector.appendChild(option);

}
else
{
myform.removeChild(gift);

}
}
</SCRIPT>
</HEAD>
<BODY >
<form action="" method="get" name="myform">
<SELECT id = "s" name="s" size=3 onChange="createtext()" ><OPTION>Visa    Card<OPTION>Mastercard<OPTION>American Express</SELECT>
</form>
</html> 

そして、ここでそれが実行されています... http://www.crazyforstamps.com/test-form-6.htm

4

3 に答える 3

0

gift質問に表示されない場所を定義したと仮定します。

すべての子要素を削除する

var gift = document.getElementById("gift");
while (gift.firstChild) {
    gift.removeChild(gift.firstChild);
}

または、別の方法として、単純に innerHTML を空の文字列に割り当てることもできます

var gift = document.getElementById("gift");
gift.innerHTML = '';
于 2013-09-17T13:35:24.697 に答える