在javascript中循环代码n次,由用户输入确定?

时间:2017-02-22 22:30:50

标签: javascript arrays loops input

我试图提供一个文本框,用户可以在其中输入要创建的数组大小,点击提交,然后会出现多次提示,每次都要求输入一个整数阵列。

这是我到目前为止所做的:

http://codepen.io/sharryliang0730/pen/pRMqOm

<!DOCTYPE html>
<html>
<head>
<script type="text/javascript">

    window.onload = function() {
        document.getElementById('ifYes').style.display = 'none';
        document.getElementById('ifNo').style.display = 'none';
             }

function yesnoCheck() {
if (document.getElementById('yesCheck').onclick) {
    document.getElementById('ifYes').style.display = 'block';
    document.getElementById('ifNo').style.display = 'none';
} 
else if(document.getElementById('noCheck').onclick) {
    document.getElementById('ifNo').style.display = 'block';
    document.getElementById('ifYes').style.display = 'none';
   }
}


            var submit = document.getElementById('submit');
    submit.onclick = function() {
getTheData() ;
}



function getTheData() {
   var sizeInput = document.getElementById("sizeInput");
   var inputValues = new Array();

    for (var i = 0; i < sizeInput; i++){
    inputValues.push(prompt('Enter the value'));

     }

}
</script>
</head>
<body>
Please choose what you wanna do:<br>

<input type="button" onclick="javascript:yesnoCheck();" name="yesno" id="yesCheck" value="Create Array"/>


<input type="button" onclick="javascript:yesnoCheck();" name="yesno" id="noCheck"value="Search Array"/>


<br>
<div id="ifYes" style="display:none">
<br> Please input the size of the array.<br><br>
<input type="text" class="sizeInput" id="sizeInput" /> <br/><br>
<input type="button" name="submit"    id="submit" value="Submit"/>
</div>


<div id="ifNo" style="display:none">

<div id="showInputValues">
</div>

编辑:我在建议的代码中添加了,但它仍然无法正常工作。我错过了什么吗?

1 个答案:

答案 0 :(得分:1)

您的inputValues为空。你需要添加这个:

    var inputValues = new Array();
    for (var i = 0; i < sizeInput; i++)
    {
        inputValues.push(prompt('Enter the value'));

    }

它会给你一个这样的数组:[&#34; 1&#34;,&#34; 2&#34;,&#34; 3&#34;]

但是如果你想让你的数组有int值,请执行以下操作:

for (var i = 0; i < 5; i++)
    {
        inputValues.push(parseInt(prompt('Enter the value')));//[1,2,3]
    }

通过您的解释var sizeInput = document.getElementById("sizeInput");

sizeInput是用户输入的数字。如果它是例如5并且您希望数组具有[0,1,2,3,4],则需要执行此操作:

  for (var i = 0; i < sizeInput; i++)
  {
    inputValues.push(i);
  }

您的代码中存在许多问题,我在下面的代码段中编辑了所有内容:

&#13;
&#13;
<head>
    <script type="text/javascript">
        window.onload = function ()
        {
            document.getElementById('ifYes').style.display = 'none';
            document.getElementById('ifNo').style.display = 'none';
            var submit = document.getElementById('submit');
            submit.onclick = function ()
            {
                getTheData();
            }
        }

        function yesnoCheck()
        {
            if (document.getElementById('yesCheck').onclick)
            {
                document.getElementById('ifYes').style.display = 'block';
                document.getElementById('ifNo').style.display = 'none';
            }
            else if (document.getElementById('noCheck').onclick)
            {
                document.getElementById('ifNo').style.display = 'block';
                document.getElementById('ifYes').style.display = 'none';
            }
        }

        function getTheData()
        {
            var sizeInput = document.getElementById("sizeInput").value;
            var inputValues = new Array();

            for (var i = 0; i < sizeInput; i++)
            {
                inputValues.push(prompt('Enter the value'));

            }

        }
    </script>
</head>
<body>
    Please choose what you wanna do:<br>

    <input type="button" onclick="javascript: yesnoCheck();" name="yesno" id="yesCheck" value="Create Array" />


    <input type="button" onclick="javascript: yesnoCheck();" name="yesno" id="noCheck" value="Search Array" />


    <br>
    <div id="ifYes" style="display: none">
        <br>
        Please input the size of the array.<br>
        <br>
        <input type="text" class="sizeInput" id="sizeInput" />
        <br />
        <br>
        <input type="button" onclick="javascript: loopFunction();" name="submit" id="submit" value="Submit" />
    </div>


    <div id="ifNo" style="display: none"></div>

    <div id="showInputValues">
    </div>
</body>
&#13;
&#13;
&#13;