jQuery函数不会改变全局变量，而常规javascript函数会

jQuery function does not change global variable while regular javascript functions do

本文关键字：函数 常规 javascript 改变 jQuery 全局变量      更新时间：2023-09-26

这段代码:

var verb = "";
    function printPage (input) {
            $("div").append(input + "<br>");
    }
    $( "#submit" ).click(function() {
       verb = $('#enter').val();
       printPage(verb);
    });
    printPage(verb);

只导致#enter(表单)的值在单击事件中记录一次(而最后一个printPage打印原始空字符串)，而以下代码:

var verb = "";
function printPage (input) {
        $("div").append(input + "<br>");
}
function buttonClick() {
  verb = "verb!";
  printPage(verb);
}
buttonClick();
printPage(verb);

打印动词两次，因为函数已经成功地更改了动词变量的值?如果我没有解释清楚我的问题，我很抱歉，如果需要的话，我会详细说明的。

输入值可能是空的，所以你可能会看到不变，你可以这样使用:

verb = $('#enter').val() || 'verb';

您的buttonClick函数在printPage函数之前运行-这使得verb变量保持'动词!'。printPage函数在verb变量具有"动词!"之后运行两次。

在jQuery的情况下，printPage函数立即运行，而verb为空。只有当你点击按钮，那么verb有一个值。

无论是否使用jQuery，如果方法运行并且$('#enter')的值不为空(否则，您将看不到更改)，它都会更改变量。

要测试这一点，将console.log( verb );放在verb = $('#enter').val();的前后。你会看到你的onClick方法没有被调用，或者它甚至没有值。

var verb = "";
function printPage (input) {
        $("div").append(input + "<br>");
}
$( "#submit" ).click(function() {
   console.log( verb );
   verb = $('#enter').val();
   console.log( verb );
   printPage(verb);
   console.log( verb );
});
printPage(verb);

我的猜测是，您没有使用正确的选择器(而不是#enter，您应该使用不同的id/类选择器)，或者该值实际上是空的。

编辑:如果您想知道console.log正在做什么，它将它写入您的浏览器的控制台(如果您已经知道这一点，请道歉)。应该可以打开它，看到我们正在打印的调试日志。

你也可以直接使用alert(动词)

相关文章：