jQuery打破了我的fizzbuzz,为什么?

时间:2015-02-12 06:19:04

标签: javascript jquery fizzbuzz

尝试用一点点html来解决javascript中的fizzbuzz问题。我想将答案放在<ul>中并在页面上显示。要做到这一点,我需要采取fizz-buzz并以某种方式将它们添加到<li>元素中,并在jQuery中添加前缀或附加。我的代码运行正常,直到我将jQuery添加到等式中以将<li>添加到html中。我目前有数字/ fizz-buzzes弹出警报。

我已尝试输入$(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的数学/逻辑部分非常简单,但正确显示它会让我感到害怕。

2 个答案:

答案 0 :(得分:0)

您应该在jquery

之前加载script.js

这是demo

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

答案 1 :(得分:0)

将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条件中。你每次都将你的李附加到ul,你将在列表中得到答案。

希望这会有所帮助。