在 mousedownevent 上生成 1-100 的 10 个随机整数时遇到问题答案

【问题标题】：Having trouble generating 10 random integers from 1-100 on a mousedownevent在 mousedownevent 上生成 1-100 的 10 个随机整数时遇到问题
【发布时间】：2013-09-01 05:04:25
【问题描述】：

我无法在 mousedownevent 上生成 1-100 的 10 个随机整数。另外我需要在表格行中显示每个，我是计算机编程的新手，我不知道我犯了什么错误。

这是我的代码：

function process() {
    'use strict';

    var ara = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
    var index;
    var output = '<tr>';

    for (var i = 0; i < 1 0; i++) {
        index = Math.floor(Math.random() * 100);
        output += '<td>' + ara[index] + '</td>';
    }

    output += '</tr>';
    document.getElementById('numbers').innerHtML = output;
}

function init() {
    'use strict';

    document.getElementById('showarray').onmousedown = process;
} // End of init() function

window.onload = init;

ID号是一个表格标签 id 显示数组是我必须单击才能获得 10 个整数的 H3 标记

这是 HTML

<!doctype html>
<html lang="en">

    <head>
        <meta charset="utf-8">
        <title>assignment2.html</title>
        <!--[if lt IE 9]>
            <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
        <![endif]-->
        <link rel="stylesheet" href="css/styles.css">
    </head>

    <body>
        <!-- assignment2.html -->
        <h2>10 Random Integers from 1 to 100</h2>

        <h3 id='showarray'>Mouse down here to show integers in table below</h3>

        <table id="numbers" border="2"></table>
        <span id="show5th">The fifth element is ?</span>

        <script src="js/assignment2.js"></script>
    </body>

</html>

jsfiddle 与 10 和 innerHTML 固定

【问题讨论】：

真的是i < 1 0 ; 1 和0 之间有空格吗？因为有了空间，那不是十，而是一和零。将其设为10
您也可以发布 HTML 吗？您可以点击编辑，然后复制/粘贴。
innerHtML 中的 t 是小写的。这也可能是个问题。
感谢您的回答。
好的，我发布了 HTML，我修复了你们告诉我的错误，但仍然无法正常工作。

标签： javascript arrays random dom-events

【解决方案1】：

从 1 到 100 生成 10 个随机数；

var numbers = [];
while (numbers.length <10) {
    // ParseInt for rounding. Real random numbers are 99 starting on 1.
    var number = parseInt(Math.random() * 99)+1,10); 
    // save the number into an array and avoid duplicated.
    if (numbers.indexOf(number) === -1 ) {
        numbers.push(number);
    }
}

在表格单元格中显示数字

如果您使用 jQuery，这将很容易。

// creates table row element
var row = $('<tr>');
$.each(numbers, function(i) {
    // creates new table cell element
    var cell = $('<td>'); 
    cell.text(i);
    // append cell into row without inserting into the DOM.
    cell.append(row);
});    
// appends the resulting row and it's content into the DOM element with an id of `#target`
$('#target').append(row);

如果您不使用 jQuery，您可以将此代码与 Xotic 提供的代码混合使用

让它在鼠标按下时发生 我使用了 click，但如果您真的需要 mousedown，请随意更改。

将上面的代码包装成2个函数，比如说：

var generateRandomNumbers = function () {
    var numbers = [];
    while (numbers.length <10) {
        var number = Math.ceil(Math.random() * 100);
        if (numbers.indexOf(number) === -1 ) {
            numbers.push(number);
        }
    }
    return numbers;
}

var appendNumbersToDom(numbers, target) {
    // you may want to check for non valid paramenters here
    var row = $('<tr>';
    $.each(numbers, function(i) {
        var cell = $('<td>');
        cell.text(i);
        cell.append(row);
    });    
    $(target).append(row);    }

和调用者

$('#showarray').on('click', function() {
    appendNumbersToDom(generateRandomNumbers, '#target');
});

【讨论】：

这不会按照 OP 帖子中的要求生成 integers。

【解决方案2】：

感谢tryToGetProgrammingStraight 的输入，我能够发现输出不需要ara。仅索引就足以生成从 1 到 100 的随机数

function process() {
    'use strict';

    var ara = [1, 2, 3, 4, 5, 6, , 7, 8, 9, 10];
    var index;
    var output = '<tr>';

    //Start of loop
    for (var i = 0; i < 10; i++) {
        index = Math.floor(Math.random() * 101);
        output += '<td>' + +index + '</td>';

    }

    output += '</tr>';
    document.getElementById('numbers').innerHTML = output;
}

function init() {
    'use strict';

    document.getElementById('showarray').onmousedown = process;
} // End of init() function

window.onload = init;

【讨论】：

你会得到一个 0 到 100 之间的数字。考虑Math.random 返回0
我注意到了这一点，有 Math.random 的替代品吗？或者我可以解决这个问题的方法。
是的，我在上面给了你一个参考，在主要问题 cmets 中，我的回答中也进行了演示。

【解决方案3】：

for(var i= 0; i < 1 0; i++) { 应该是for(var i= 0; i < 10; i++) { 1 和 0 之间没有空格

还有更重要的ara[index]应该是index，为什么你还有ara？如果是for循环那么

没必要
然后使用for(var i in ara) 而不是for(var i= 0; i < 10; i++) {

不管怎样，你想要什么，你得到了什么？请澄清。

【讨论】：

TryingToGetProgramming 感谢您的意见。我不太明白你的第二点。但是，当我单击 H3 文本时，我需要在一行的表中获取随机整数。所以当我点击它时，应该会出现这样的表格 random integer 1 random integer 2>... 依此类推，直到有 10 个。
@SimonHerrera 然后使用ara[i] + " " + index。以当前编写该行的方式打开您的控制台应该会产生错误，那是因为没有ara[index]。我的第二点是，它是一种更好的方法，也是循环数组的正确方法（你说你没有这样做）
注意：不要使用for..in 循环来迭代数组。
@Xotic750 嗯，据我所知，你不是这样做的，请解释一下，和/或提供来源。
@SimonHerrera 顺便说一句，如果我回答了您的问题，请 1+ 和/或标记为已回答。