-1

私はこれを必要以上に難しくしていると思います。ここに私のjsfiddleがありますhttp://jsfiddle.net/justmelat/pArU7/2/

ストレートhtml：

<form>
.
<input type="radio" name="sex" value="House">House&nbsp;&nbsp;&nbsp;
<input type="radio" name="sex" value="Cars">Cars
    <hr>
        <select name="cars">
            <option value="0">--Select--</option>
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="fiat">Fiat</option>
<option value="wood">Wood</option>
<option value="audi">Audi</option>
<option value="brick">Brick</option>

</select>
</form>

ユーザーが家を選択すると、選択、木材、レンガのオプションのみがドロップダウンに表示され、車が選択された場合は木材とレンガが消えるはずです。

これをjavascriptで簡単に行うにはどうすればよいですか?

4

2 に答える 2

2

デモ: http://jsfiddle.net/33tJR/

私が作成した簡単なモックアップで、jQuery などを使用した派手なものは何もありません

function createOption(value) {
    el = document.createElement('option');
    el.value = value;
    el.innerHTML = value;
    el.id = value;

    document.getElementById('select').appendChild(el);
}

document.getElementById('house').addEventListener('click', function() {
    document.getElementById('select').innerHTML = '';

    createOption('Volvo');
    createOption('Saab');
    createOption('Fiat');
});

document.getElementById('cars').addEventListener('click', function() {
      document.getElementById('select').innerHTML = '';

    createOption('Wood');
    createOption('Brick')
});
于 2013-04-15T14:14:03.293 に答える
-2

ラジオ ボタンの onchange イベントを使用し、値が male に一致する場合は、オプション リストを作成し、既存のリストをクリアして新しいリストを追加する JavaScript を呼び出します。これらはすべてjqueryを使用しました

  $(document).ready(function(){
  $("input[name='sex']").change(function() {
       if($(this).value === "male") { loadDLLWithOption1();  }
       else { loadDLLWithOption2(); }
    }
   });
   function loadDLLWithOption1()
    {
         var optionList = '<option>option1</option><option>option2</option>';
         $("#cars").html(optionList); 
    }
于 2013-04-15T13:50:40.690 に答える