Question

我尝试向URL发送ajax请求，期望获得json响应，但是，请求似乎没有发送到/ login。相反，它保留在当前URL上并向其添加formData参数。它也没有感知＆＃34; POST＆＃34;。出了什么问题：

$(document).ready(function() {
  $("#login").click(function() {
    var formData = {username: username, password: password}
    $.ajax({
      type: "POST",
      url: "/login",
      dataType: 'json',
      data: formData,
      success: function (data) {
        var json_x = data;
        alert(json_x['data']);
      }
    });
  });
});

HTML：

<form>
  <input type="text" name="username">Username</input>
  <input type="password" name="password">Password</input>
  <button type="button" id="login">Login</button>
</form>

Answer 1

尝试：

$(document).ready(function() {
  $("#login").click(function() {
    // you forgot to get value of username and password
    var formData = {username: $('#username').val(), password: $('#password').val()};
    $.ajax({
      type: "POST",
      url: "/login",
      dataType: 'json',
      data: formData,
      success: function (data) {
        console.log(data);
      }
    });
  });
}); 

<form>
  <input type="text" name="username" id="username">Username</input>
  <input type="password" name="password" id="password">Password</input>
  <button type="button" id="login">Login</button>
</form>

Answer 2

UPDATE3：请参阅formData的新声明。

var formData = {
    username: $("input[name='username']").val(),
    password: $("input[name='password']").val()
};

Answer 3

使用此代码

alert(json_x.data);

而不是

alert(json_x['data']);

也改变了这一行

var formData = {username: username, password: password}

进入

var formData = $(this).parent().serialize();

Answer 4

正确的答案是使用$（“button”）而不是$（“＃login”）。

我已经解决了。

AJAX请求不发送到URL

4 个答案: