Question

好的，所以我有以下代码。第一个警报在加载时正常运行，但第二个警报永远不会。要添加，点击id=sign按钮永远不会有效，但这是一个单独的问题。我觉得＆＃34;警报＆＃34;可能是一个关于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}

Answer 2

在jQuery中，您必须知道DOM何时可以执行任何代码，因为，jQuery是关于DOM操作的，并且当DOM中不存在时，您无法操纵html标记。 / p>

您可以使用：

$(document).ready(function()
{
    // Code...
});

或者

$(function()
{
    // Code...
});

＆＃13;

$(document).ready(function() { // This code makes sure to execute Javascript code when the DOM is loaded completely, only once.
  alert("Here #1");

  $("#buttonClick").click(function() {
    var div = $("#mainBackground");
    div.slideUp(400, function() {
      redirect();

    });
  });

  alert("Here #2");

  $("#sign").click(function() {
    jQuery.ajax({
      url: "check_availability.php",
      data: { // Correct
        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() {}
    });
  });
});

＆＃13;

jQuery在一个地方正常运行，但在另一个地方运行不正常

2 个答案: