Question

注意：我将指定我为此问题找到的解决方法，但我仍然不明白为什么第一种方法对我没有/不起作用。

我的HTML文件有一个jQuery脚本，它应该通过ajax请求向服务器发送一个数字。这是我的脚本布局的方式：

// Beginning of script
var number = 0; //ensure that the variable has global scope

// Send number to server on click of button (which has type 'button' not 'submit') in HTML document
$(document).ready(function() {
    $( "#button" ).click(function() {
        number = 0; // reset the value of the number every time the button is clicked

        // A function runs here and returns a number, and it has a callback (which gets passed that returned number).
        // Callback is defined as follows:
        function callback(returnedNumber) {
            if (condition == true) {
                alert("Condition passes");
            } else {
                // assign returnedNumber to 'number', then initiate ajax POST request to server
                number = returnedNumber; // just assume returnedNumber is 23
            }

            // Notice that the ajax request is NOT initiated as part of the else statement.
            $.post("test.php", { key: number }, function(data) {
                $( "#resultDiv" ).html(data);
            });
        }
    });
});

现在这是服务器上的“test.php”文件：

<?php
    echo var_dump($_POST);
?>

当回调中的条件未通过时，var_dump()显示$_POST["key"]的值仍为0而不是23，这就是我感到困惑的地方。我对JS作用域规则的理解是，一旦变量被全局声明，只要var关键字不用于在函数内重新声明变量，函数就可以修改它的值。我认为这意味着使用我的回调来重新分配number的值也会改变全局变量number的值，从而允许我将它发送到服务器而不需要ajax请求重新分配变量的else语句。那么，我有哪些错误？如果有文件有助于澄清我的误解，请提供一个链接。 :)

我的解决方法：我只是将ajax POST请求附加到else语句，这就像我想要的那样。但是我不明白为什么当请求不是else语句的一部分时，ajax请求不会更新number的值。

谢谢！

Answer 1

正如您在本示例中所看到的，您对范围部分是正确的，因此必然会出现其他错误，可能在回调中。也许您正试图以异步方式获取号码，在您收到回复之前发布数据？

＆＃13;

var condition = false;
var number = 0; //ensure that the variable has global scope

$("#button").click(function() {
  number = 0; // reset the value of the number every time the button is clicked
  function callback(returnedNumber) {
    if (condition == true) {
      //alert("Condition passes");
    } else {
      // assign returnedNumber to 'number', then initiate ajax POST request to server
      number = 23; // just assume returnedNumber is 23
    }
    condition = !condition;
    $("#result").text(`Result: ${number}. Setting condition to ${condition}`);
  }
  // Call the callback as an actual callback
  setTimeout(callback, 1000);
});

＆＃13;

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

＆＃13;

JavaScript范围规则可能被jQuery / Ajax篡改？

1 个答案: