javascript - JQuery 将错误的值附加到变量

Question

我正在制作一个页面来计算和显示从 1 到 100 的所有质数。实际的质数计算工作正常，但是当我试图通过 JQuery 附加测试为质数的数字时，它会改为附加它每次都作为数字 101。

JS代码:

function primeFinder() {
    var testNum = 1;
    var failures = 0;
    var checkNum = testNum -1;
    while(testNum <= 100) {
        while(checkNum > 1) {
            if ((testNum/checkNum)%1 != 0) {
                failures += 1;
                checkNum -= 1;

                }
            else {
                checkNum -= 1;
                }               
            }
        if (failures == testNum - 2) {
                $(document).ready(function(){
                    $("#results").append(testNum + "<br>")
                })
                failures = 0;
                testNum +=1;
                checkNum = testNum -1;
        }
        else {
            failures = 0;
            testNum +=1;
            checkNum = testNum -1;
        }
    }
}

它正确地附加了它，它只是附加了不正确的值，原因我无法弄清楚。如果我将变量更改为文本，那么它就没有问题。这只是它无法正确处理的变量。

Answer 1

根据我的评论:您在每个循环中附加 testNum，但仅在文档准备好之后。这导致 testNum 的最终值被附加，因为循环很可能在文档准备好之前就已经执行了。

要避免此问题，只需将整个函数包装在 DOM 就绪事件中，就可以开始了。这是基于您提供的代码的概念验证片段。

$(document).ready(function() {
   // You can move this function declaration outside DOM ready, doesn't matter
   var primeFinder = function() {
     var testNum = 1;
     var failures = 0;
     var checkNum = testNum - 1;
     while (testNum <= 100) {
       while (checkNum > 1) {
         if ((testNum / checkNum) % 1 != 0) {
           failures += 1;
           // console.log(checkNum + " ~~~ " + failures);
           checkNum -= 1;

         } else {
           checkNum -= 1;
         }
       }
       if (failures == testNum - 2) {
         console.log(testNum + " is prime!");

         $("#results").append(testNum + "<br>")
         failures = 0;
         testNum += 1;
         checkNum = testNum - 1;
       } else {
         // console.log(testNum + " is NOT prime!");
         failures = 0;
         testNum += 1;
         checkNum = testNum - 1;
       }
     }
   }
   
   // But you must execute this function within DOM ready
   primeFinder();
 });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="results"></div>