在函数中输入10后,var变为NaN

Question

var post = 10;
function load_more(str) {
        var xmlhttp = new XMLHttpRequest();
        xmlhttp.onreadystatechange = function() {
            if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
                document.getElementById("add").innerHTML = document.getElementById("add").innerHTML + xmlhttp.responseText;
            }
        };
        var post = post + 10;
        xmlhttp.open("GET", "fetch_more.php?number=" + post , true);
        xmlhttp.send();
}

当我加载网站时,我希望浏览器定义值10发布并且不做任何事情,直到我按下一个调用load_more()函数的按钮,该函数将该值递增10并通过Ajax将其传递给PHP.

所需的行为是在网站上有10个帖子,然后每次按下按钮时再按下按钮10.

但PHP只会抛出一个MySQL错误,日志显示post var是NaN.

Answer 1

这条线

var post = post + 10;

是罪魁祸首.Javascript有一个名为hoisting的行为,这实际上意味着您的变量总是在作用域的顶部声明.

所以在你的代码中,会发生以下情况:

var post = 10;
function load_more(str) {
    var post; // `post` is now undefined
    //...other code
    post = post + 10; // undefined + 10 evaluates to NaN
}

我希望你能看到,因为post在函数的开头是重新定义的,post就是undefined当你使用它时post + 10,导致post = post + 10求值NaN(自undefined + 10评估到NaN).

要解决您的问题,只需var从前面删除:

post = post + 10;

要么:

post += 10;