Question

我正在学习Javascript，我正在尝试创建一个脚本，要求用户输入一个数字，然后脚本将打印出一个数组的结果。我已经想出了如何使用prompt命令执行此操作，但想要了解如何使用网页上的输入字段来执行此操作，以便用户输入数字，点击按钮，然后它将运行脚本。 / p>

这是我写的：

标题脚本：

do {
   var num = prompt('Enter a number between 1 and 10?','');
   num = parseInt(num, 10);
} while (isNaN(num));

var surge = [
    'One',
    'Two',
    'Three',
    'Four',
    'Five',
    'Six',
    'Seven',
    'Eight',
    'Nine',
    'Ten'
];

正文脚本：

document.write(surge[num-1]);

我不知道如何将其转换为输入字段/按钮格式并保持do / while以确保输入数字。另外，我如何更改do / while以便确保无法输入大于10的数字并确保它是一个数字？任何和所有的帮助将不胜感激。谢谢！

Answer 1

示例HTML：

<input type='text' id='number' />
<input type='button' id='add' value="click" />
<div id='numbers'> </div>

和此

的脚本

var surge = [ 'One', 'Two', 'Three', 'Four', 'Five', 'Six', 'Seven', 'Eight', 'Nine', 'Ten' ];

//helper function for get elements
var get = function( id ) {
    return document.getElementById( id );
};

//add handle to click event on '#add' button 
get( "add" ).onclick = function () {

    // get value of #number input
    var n = get( "number" ),
        s = surge[ n.value -1];

    //if element in surge at index n.value - 1 is present
    if( s ) {    
        // write this in next paragraph which is pushed to div#numbers
        get( "numbers" ).innerHTML += "<p>" + s + "</p>";
    };

    //reset value of input #number
    n.value = ""

};

演示：http://jsfiddle.net/a9zZL/1/

1-10之间的输入数字，单击按钮，获取结果

1 个答案: