2017-07-04 5 views
0

私は現在、テストの目的でMonthとDateを含むBirthdateの選択オプションを作成しています。すべてうまくいきますが、問題は1月を選択すると31日になりますが、31が選択されていれば、Febrauryを選択すると前の配列に新しい配列、つまり1月の31日+ 2月28日の配列が追加されます。以前の配列をクリアしてから新しい配列を追加する方法を教えてください。JavaScriptのforループに新しいデータを書き込む前に配列をクリアするには?

ここではJavascriptをです:

function change(){ 
    var s1 = document.getElementById('select1'); 
    var s2 = document.getElementById('select2'); 
    var i; 
    var optionIndex = []; 

    if(s1.value === 'January'){ 
     var i; 
     s2.style.display = 'inline-block'; 
     for(i = 1; i <= 31; i = i + 1){ 
      optionIndex.push(i); 
     } 
    }else if(s1.value === 'February'){ 
     var i; 
     s2.style.display = 'inline-block'; 
     for(i = 1; i <= 28; i = i + 1){ 
      optionIndex.push(i); 
     } 
    } 

    var option; 
    for(option in optionIndex){ 
     if(optionIndex.hasOwnProperty(option)){ 
     var pair = optionIndex[option]; 
     var createOption = document.createElement('option'); 
     createOption.innerHTML = pair; 
     s2.appendChild(createOption);  
     } 
    } 
} 

そしてHTML:

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <meta charset="UTF-8"> 
    <title>Form Selector</title> 
</head> 
<body> 
    <select id = "select1" name = "select1" onchange="change()"> 
     <option>Select Year...</option> 
     <option>January</option> 
     <option>February</option> 
     <option>March</option> 
     <option>April</option> 
     <option>May</option> 
     <option>June</option> 
     <option>July</option> 
     <option>August</option> 
     <option>September</option> 
     <option>October</option> 
     <option>November</option> 
     <option>December</option> 
    </select> 
    <select id = "select2" name = "select2" style = "display:none;"> 

    </select> 
</body> 
</html> 

私は、)(array.popみましたarray.splice()が、まだ動作しません!私を助けてください!

+0

を試してみてくださいあなたはselect要素の選択肢をクリア意味しますか?その場合は、配列オブジェクトではなくその要素を操作する必要があります。例: 's2.innerHTML = '''そうでなければ、 'change()'が呼び出されるたびに 'optionIndex'が既に新しい配列に設定されているので、さらに説明してください –

+0

このコードが何をするのか正確に詳細に説明するには、壊れたコードは適切ではありません – charlietfl

+0

マークアップのオプションには常に値を与える必要があります。 –

答えて

0

問題は配列ではありません。問題は、変更をトリガするときにs2をクリアしないことです。

function change(){ 
 
      var s1 = document.getElementById('select1'); 
 
      var s2 = document.getElementById('select2'); 
 
      var i; 
 
      var optionIndex = []; 
 

 
      if(s1.value === 'January'){ 
 
       var i; 
 
       s2.style.display = 'inline-block'; 
 
       for(i = 1; i <= 31; i = i + 1){ 
 
        optionIndex.push(i); 
 
       } 
 
      }else if(s1.value === 'February'){ 
 
       var i; 
 
       s2.style.display = 'inline-block'; 
 
       for(i = 1; i <= 28; i = i + 1){ 
 
        optionIndex.push(i); 
 
       } 
 
      } 
 
      s2.innerHTML = ""; // You need this 
 

 
      var option; 
 
      for(option in optionIndex){ 
 
       if(optionIndex.hasOwnProperty(option)){ 
 
        var pair = optionIndex[option]; 
 
        var createOption = document.createElement('option'); 
 
        createOption.innerHTML = pair; 
 
        s2.appendChild(createOption); 
 
       } 
 
      } 
 
     }
<select id = "select1" name = "select1" onchange="change()"> 
 
     <option>Select Year...</option> 
 
     <option>January</option> 
 
     <option>February</option> 
 
     <option>March</option> 
 
     <option>April</option> 
 
     <option>May</option> 
 
     <option>June</option> 
 
     <option>July</option> 
 
     <option>August</option> 
 
     <option>September</option> 
 
     <option>October</option> 
 
     <option>November</option> 
 
     <option>December</option> 
 
    </select> 
 
    <select id = "select2" name = "select2" style = "display:none;"> 
 

 
    </select>

+0

うるう年はどうですか? 1月と2月以外の月はどうですか? – charlietfl

+0

Wooooooooooooooooooooooooooooooooooooooooohhhhh!ありがとう、たくさんの男!ありがとう!ありがとう!ありがとう! – Bill

+0

@charliefl私はそれを管理します!これはテスト目的のためだけです! – Bill

関連する問題