JavaScriptを使って動的に変更するHTMLドロップダウンメニュー

Question

私はこれを動作させようとしてきましたが、私は困惑しています。私はドロップダウンメニューからなるフォームを持っています。私がしようとしているのは、誰かがチューターリストが動的に変わるサブジェクトを選択するときです。しかし、サブジェクトが選択されていなければ、チューターのドロップダウンメニューにデフォルトリストが表示されます。ここで

は、私がこれまで持っているものです：

のindex.php

<form id="show-course" name="show-course" method="post" action="#"> 
    <table id="search"> 
      <tr> 
       <th class="subject"> 
       <select name="subject" onchange="showCourse(this.value, 'Subject');listTutors(this.selectedIndex);"> 
        <option selected="selected" value=""></option> 
        <option value="Subject">Subject</option> 
        </select> 
       </th> 
       <th class="tutor"> 
      <select name="tutor" onchange="showCourse(this.value, 'Tutor');"> 
       <option selected="selected" value=""></option> 
       <option value="Tutor">Tutor</option> 
      </select> 
       </th> 
      </tr> 
    </table> 

script.js

function listTutors(index) 
{ 
document.show-course.tutor.options.length = 0; 
switch (index) 
{ 
    case 1: 
    case 2: 
    case 3: 
    case 4: 
    alert(index); 
    break; 
    case 5: 
    alert(index); 
    break; 
} 
} 

私はdocument.showを取得することはできません-course.tutor.options.length = 0;コードラインを動作させる。私はこれを働かせることができれば私は自分自身のために残りを把握することができると私は思う。ありがとう！

Answer 1

まず、あなたが必要となる名前でダッシュを持っていると

document.show-course.tutor.options.length = 0; 

のようにそれらにアクセスすることはできません

あなたが意味

document.forms["show-course"].tutor.options.length = 0; 

<select name="subject" onchange="showCourse(this.value, 'Subject');listTutors(this);"> 

と

function listTutors(sel) { 
    var index = sel.selectedIndex 
    // sel.options.length = 0; // this will EMPTY the list is that what you want? 
    sel.selectedIndex = 0; // this will reset the selection - I think that is what you meant