For循环语法错误-一次点击将通过整个循环

For Loop syntax error -one click goes through entire loop

本文关键字：循环 一次 错误 语法 For      更新时间：2023-09-26

作为一个javascript新手，我想我有一个简单的问题。

  • edit我想要一个事件发生(两个按钮出现)后，用户从下拉框单击一个选项3次。我最初认为for循环可以帮我做到这一点。我还希望最后一个选项("None"或其他选项)能够显示警告，而不会影响你剩下的点击回合数。希望这能说得通。

任何帮助都将是非常感激的。

var question1 = new Array(); 
window.onload = function () {
    var eSelect = document.getElementById('question1');
    var optOtherReason = document.getElementById('displayresponse');
    var options = document.getElementsByTagName("option");
    eSelect.onchange = function() {
        for (var i=0; i<3; i++) {
            if (eSelect.selectedIndex !== 3) {
                    var li = document.createElement("li");
                    li.innerHTML = options[eSelect.selectedIndex].innerHTML;
                    var ol = document.getElementById("appendedtext");
                    ol.appendChild(li);         
                question1.push(li.innerHTML);
                var x= document.getElementById("display");
                x.innerHTML=question1;  
            }
        } 
        if (eSelect.selectedIndex == 3) {
            i=0;
            optOtherReason.style.display = 'block';
        }
    }
    insertbutton= "block";
    displaybutton = "block";
}
<select id="question1" name="question">
    <option value="x">Reason1</option>
    <option value="y">Reason2</option>
    <option value="other">Otherreason</option>
    <option value="none">None</option>
</select><br>
<div id="insertbutton" style="display:none;">
    <input type="button"  value="Save" onclick="insert();">
</div>
<div id="generatebutton" style="display:none;">
    <input type="button" value="Show Drink" onClick="generate();">
</div>
<div id="displayresponse" style="display:none;">If you did not see a choice here, you may search for other sites.</div>
<ol id="appendedtext"> </ol>
<div id="display"></div>

我认为你不需要循环遍历选项，因为你直接访问索引。这似乎就是你要找的:

<script type="text/javascript">
var question1 = new Array(); 
window.onload = function() {
var eSelect = document.getElementById('question1');
var optOtherReason = document.getElementById('displayresponse');
var options = document.getElementsByTagName("option");
eSelect.onchange = function() {
    //for (var i=0; i<3; i++) {
    if (eSelect.selectedIndex !== 3) {
    var li = document.createElement("li");
    li.innerHTML = options[eSelect.selectedIndex].innerHTML;
    var ol = document.getElementById("appendedtext");
    ol.appendChild(li);         
    question1.push(li.innerHTML);
    var x= document.getElementById("display");
    x.innerHTML=question1;  
    }
    //} 
 if (eSelect.selectedIndex == 3){
        //i=0;
        optOtherReason.style.display = 'block';
        }
    }
    insertbutton= "block";
        displaybutton = "block";
} 
</script>
<select id="question1" name="question">
<option value="x">Reason1</option>
<option value="y">Reason2</option>
<option value="other">Otherreason</option>
<option value="none">None</option>
</select><br>
<div id="insertbutton" style="display:none;">
<input type="button"  value="Save" onclick="insert();"></div>
<div id="generatebutton" style="display:none;">
<input type="button" value="Show Drink" onClick="generate();"></div>
<div id="displayresponse" style="display:none;">If you did not see a choice here, you may search for other sites.</div>
<ol id="appendedtext"> </ol>
<div id="display"></div>

我同意Don的观点，我认为for循环没有必要。我要做的一个小区别是检查所选值而不是索引，因为下拉列表的顺序很容易改变。此外，使用if-else语句比使用两个if语句更简洁。

var question1 = new Array(); 
window.onload = function() {
var eSelect = document.getElementById('question1');
var optOtherReason = document.getElementById('displayresponse');
var options = document.getElementsByTagName("option");
eSelect.onchange = function() {
var optOtherReason = document.getElementById('displayresponse');
var options = document.getElementsByTagName("option");
    if (eSelect.value !== "other") {   // For loop eliminated, checking value now
        var li = document.createElement("li");
        li.innerHTML = options[eSelect.selectedIndex].innerHTML;
        var ol = document.getElementById("appendedtext");
        ol.appendChild(li);         
        question1.push(li.innerHTML);
        var x= document.getElementById("display");
        x.innerHTML=question1;  
    }else{    // Using else here
        optOtherReason.style.display = 'block';
    }
    }
    insertbutton= "block";
    displaybutton = "block";
}
相关文章：