Question

这是我使用Ajax将表单数据发送到nodejs的代码。我希望在不重新加载页面的情况下实现此目的。我试图在IE，Firefox和Chrome中运行它。没有看到输出，因此我想知道我哪里出错了。我是Ajax的新手，请帮助我！

<html>
<meta charset="UTF-8">
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
<script>


  $('#newform').on('submit', function (event) {
	 //alert('Hi');
    event.preventDefault();
    var data = {
      username: $('#username').val(),
    };
	
    $.ajax({
      url: 'http://127.0.0.1:8081/upload',
      data: data,
      method: 'POST'
    }).then(function (response) {
      
      $('body').append(response);
    }).catch(function (err) {
      console.error(err);
    });
  });
</script>


</head>
<body>
<form action="/upload" method="post" id="newform">
<input type="text" name="username" id="username"></input>
<input type="button" value="submit" id="s1"></input>
</form>

</body>

</html>

Answer 1

我看到你包括jquery的1.5版本（现在是1.11 ..）。这是非常古老的。但运行您的代码我看到以下错误：TypeError: $(...).on is not a function。

如果我们转到.on方法（http://api.jquery.com/on/）的jQuery文档，我们可以看到它包含在1.7版中，这意味着您所包含的版本中没有。< / p>

我的建议是将库更新为1.11.3（最新）http://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js

代码看起来不错。啊，当你运行脚本时，你应该检查chrome中检查器控制台中的错误，这样你就可以看出错误了。

使用Ajax将表单数据发送到nodejs而不重新加载页面

1 个答案: