Question

所以基本上我有一个for循环，我试图让它运行x次。取决于用户输入的内容。我遇到的问题是如何获取用户输入，并确保它的数字不是任何其他类型的输入。如果错误的话，让他们再试一次。

Answer 1

在 HTML5 中，您可以使用<input type="number">将输入限制为仅限数字字符。

对于与HTML5不兼容的旧版浏览器，请使用<input type="text" onkeypress='return event.charCode >= 48 && event.charCode <= 57'></input>。这利用了Javascript来确保input框中只接受数字输入。

查看以下两个解决方案的代码段：

Javascript-based:<input type="text" onkeypress='return event.charCode >= 48 && event.charCode <= 57'></input>
<br><br>
HTML5 solution (preferred):<input type="number">

Answer 2

<强> HTML：

<input type="text" name="somefield" id="someid" value="10" />

<强> JS：

var userInput = document.getElementById('someid').value;
if( Number.isInteger(parseInt(userInput)) )
{ 
    // do something 
}

此外，Number.isInteger()在Internet Explorer 11或更早版本上不起作用。

Answer 3

Fiddle

<强> HTML

<input type="number" id="myInput">
<button id="myButton">Run Loop</button>

<强>的Javascript

$('body').on('click', '#myButton', function() {
  var input = $('#myInput').val();
  for(var i = 0; i < input; i++) {
  alert('You have written inside input field: ' + input + ". This is Alert #" + (i+1))
  }
});

Answer 4

要从value获取input，您可以使用输入元素的value属性。

要确保输入是一个数字，您可以指定type="number"，如果支持HTML5，如Angelos Chalaris answer中所述。

＆＃13;

document.getElementById('btn').onclick = function(){
    var totalIterations = parseInt(document.getElementById('input').value);
    var output = document.getElementById('output');
    output.innerHTML = '';
    for(var i = 1; i <= totalIterations; i ++) {
        var item = document.createElement('div');
        item.innerHTML = i;
        output.appendChild(item);
    }
};

＆＃13;

<input id="input" type="number"/>
<input id="btn" type="button" value="Do loop"/>
<div id="output"></div>

＆＃13;

Answer 5

以下是使用用户输入对话框的示例：

var input, parsedInput = 0;

do {
  input = prompt("Please enter valid number", "1");  
    parsedInput = parseInt(input);

} while(isNaN(parsedInput) || parsedInput < 0); 
 // keep trying on invalid input or negative number

for( i=0; i< parsedInput ; i++){
  console.log("loop " + i);
}

Answer 6

这很简单

Input Number : <input id="numberinput" onkeypress="return event.charCode >= 48 && event.charCode <= 57" />

<button id="btn" onclick="doAction()">
Send
</button>

<script>
var doAction = function () {
    var input = document.getElementById('numberinput');
    var times = parseint(input.value);

    for(var i = 0; i < times; i++) {
      //do whatever you need to do
    }
}
</script>

用于循环用户输入javascript

6 个答案: