jQuery 打破了我的嗡嗡声，为什么？答案

【问题标题】：jQuery breaking my fizzbuzz, why?jQuery 打破了我的嗡嗡声，为什么？
【发布时间】：2015-02-12 06:19:04
【问题描述】：

尝试用一点 html 解决 javascript 中的 fizzbuzz 问题。我想把答案放在<ul> 中并显示在页面上。为此，我需要获取 fizz-buzz 并以某种方式将它们添加到 UL 的 <li> 元素中，并在 jQuery 中添加前置或附加。我的代码运行良好，直到我将 jQuery 添加到等式中以将 <li>s 添加到 html 中。我目前有弹出警报的数字/嘶嘶声。

我尝试输入$(document).ready(function() {}，将所有javascript 括在括号内。如果我这样做了，它就会中断，即使 javascript 部分中实际上有 0 个 jQuery。简单地中断，好像页面从未真正准备好，因此 javascript 将永远不会运行。

假设我可以让任何 jQuery 工作，我可以简单地将 jQuery 语句放在我的 elseif 语句中吗？示例：

else if (n1 % 5 === 0) {
        $("ul").prepend("<li>n1</li>")
    }

Javascript：

var number = prompt("number?");
var num_int = parseInt(number);

 var smack = new Array(num_int);

//populating array with numbers 1 through num_int
for (i = 0; i < smack.length; i++) {
    smack[i] = i+1;                         
              } //test again still working?

smack.forEach(function(n1) { //going through each array element, checking for fizz/buzz

    if (n1 % 3 === 0 && n1 % 5 === 0) {
        alert("fizz-buzz")

    }
    else if (n1 % 3 === 0) {
        alert("fizz")

    }
    else if (n1 % 5 === 0) {
        alert("buzz")
    }
    else {
        alert(n1)
    }


}); //end of forEach

HTML：

<hmtl>
<head>
<script src="scripts.js"></script>
<script src="jquery-1.11.2.js"></script>
</head>

<body>
<p>
<h1>Fizzbuzz</h1>
<ul id="hard">
<li>test</li>
</ul>
</p>


</body>

</html>

JSFiddle

提前感谢您的帮助！我敢肯定，对于任何有经验的人来说，这都是一个非常简单的问题。我刚刚开始研究它，虽然 fizzbuzz 的数学/逻辑部分非常简单，但让它正确显示让我很生气。

【问题讨论】：

else if 可以放入。
如果您的 fizzbuzz 逻辑在 scripts.js 文件中，您需要在 jquery 脚本之后加载它。否则，当您尝试引用它时，jquery 将是未定义的。
试试这个：jsfiddle.net/e6a609wu/2

标签： javascript jquery fizzbuzz

【解决方案1】：

你应该在script.js之前加载jquery

这是demo

我加了$('#hard').append

【讨论】：

【解决方案2】：

将 JQuery 部分更改为：

var number = prompt("number?");
var num_int = parseInt(number);

var smack = new Array(num_int);

//populating array with numbers 1 through num_int
for (i = 0; i < smack.length; i++) {
    smack[i] = i+1;                         
              } //test again still working?

smack.forEach(function(n1) { //going through each array element, checking for fizz/buzz

    if (n1 % 3 === 0 && n1 % 5 === 0) {
        $('#hard').append("<li>fizz-buzz</li>");

    }
    else if (n1 % 3 === 0) {
       $('#hard').append("<li>fizz</li>");

    }
    else if (n1 % 5 === 0) {
        $('#hard').append("<li>buzz</li>");
    }
    else {
        $('#hard').append("<li>"+n1+"</li>");
    }


}); //end of forEach

会有帮助的。

这里的变化在 if 条件内。你每次都将你的 li 附加到 ul 中，你的答案就会出现在列表中。

希望这会有所帮助。

【讨论】：