javascript - jQuery 在一个地方正常运行，但在另一个地方却无法正常运行

Question

好吧，我有以下代码。第一个警报在加载时正常运行，但第二个警报永远不会运行。要添加，单击带有 id=sign 的按钮永远不会起作用，但这是一个单独的问题。我觉得“警报”可能是 id 哪里出了问题的线索，所以任何帮助都会有用。谢谢。

<script>
  alert("Here #1");
  $(document).ready(function() {
    $("#buttonClick").click(function() {
      var div = $("#mainBackground");
      div.slideUp(400, function() {
        redirect();

      });
    });
  });

  alert("Here #2");

  $(document).ready(function() {
    $("#sign").click(function() {
      jQuery.ajax({
        url: "check_availability.php",
        data: 'username=' + $("#username").val(),
        'password=' + $("#password").val();
        type: "POST",
        success: function(data) {
          alert("hereagain");
          if ($("#username").val() === "") {
            //Do nothing
          } else if ($('#username').val().length < 5) {
            $("#usernameConsole").html("Username must be 5-15 characters");
            $("#username").css('backgroundColor', '#ff6666');
            $("#usernameAvailable").css('color', '#ff6666');
          } else if (data === "accept") {
            $("#usernameConsole").html("Signed In");
            $("#username").css('backgroundColor', '#66cc66');
            $("#usernameAvailable").css('color', '#66cc66');
          } else {
            $("#usernameConsole").html("Not accepted");
            $("#username").css('backgroundColor', '#ff6666');
            $("#usernameAvailable").css('color', '#ff6666');
          }
        },
        error: function() {}
      });

    });
  });
</script>

<script>

Answer 1

固定代码:

alert("Here #1");
$(document).ready(function() {
  $("#buttonClick").click(function() {
    var div = $("#mainBackground");
    div.slideUp(400, function() {
      redirect();

    });
  });
});

alert("Here #2");

$(document).ready(function() {
  $("#sign").click(function() {
    jQuery.ajax({
      url: "check_availability.php",
      data: ['username=' + $("#username").val(), 'password=' + $("#password").val()],
      type: "POST",
      success: function(data) {
        alert("hereagain");
        if ($("#username").val() === "") {
          //Do nothing
        } else if ($('#username').val().length < 5) {
          $("#usernameConsole").html("Username must be 5-15 characters");
          $("#username").css('backgroundColor', '#ff6666');
          $("#usernameAvailable").css('color', '#ff6666');
        } else if (data === "accept") {
          $("#usernameConsole").html("Signed In");
          $("#username").css('backgroundColor', '#66cc66');
          $("#usernameAvailable").css('color', '#66cc66');
        } else {
          $("#usernameConsole").html("Not accepted");
          $("#username").css('backgroundColor', '#ff6666');
          $("#usernameAvailable").css('color', '#ff6666');
        }
      },
      error: function() {}
    });

  });
});

您正在传递 ajax 中的数据功能错误。

编辑 1: 但最好将数据作为对象传递:

data: {fieldName1: value1, fieldName2: value2}