我正在尝试创建登录页面,但我坚持将数据作为 JSON 发送到 Cherrypy。尝试覆盖提交按钮,因为当我按下按钮时 AJAX 不会发送任何数据。
旧代码已删除
<小时/>@EDIT I have changed the code and now I am not sending any data to server (I assume that cuz there is nothing in console after pressing the button)
我的.js
$("#myForm").click(function(){
var dataString = {};
dataString.login = $("#login").val();
dataString.password = $("#password").val();
$.ajax({
type: 'POST',
url: 'http://localhost:8080/login',
data: JSON.stringify(dataString),
contentType: 'application/json',
dataType: 'json',
success: function(response) {
console.log(response);
},
error: function(response) {
console.log(response);
}
});
});
我的.html
<!DOCTYPE html>
<html>
<head>
<link href="style.css" rel="stylesheet">
<script src="http://code.jquery.com/jquery-2.0.3.min.js"></script>
<script src="example.js"></script>
</head>
<body>
<div class="login-page">
<div class="form">
<form id="myForm" class="login-form">
<input type="text" name="login" id="login" placeholder="login"/>
<input type="password" name="password" id="password" placeholder="password"/>
<button form="myForm" type="submit">Login</button>
<p class="message">Not registered? <a href="#">Create an account</a></p>
</form>
</div>
</div>
</body>
</html>
登录页面(数据未加密?)
- 链接中有密码?
我的控制台(空?)
- 没有登录电话
我在这里做错了什么?
最佳答案
您想要执行发布请求(您还必须在服务器端处理发布):
type: 'POST',
还将其放入您的提交函数中:
var dataString = {};
dataString.login = $("#login").val();
dataString.password = $("#password").val();
所以代码变成:
<form id="myForm" class="login-form">
<input type="text" id="login" placeholder="login"/>
<input type="password" id="password" placeholder="password"/>
<button class="button_submit">login</button>
<p class="message">Not registered? <a href="#">Create an account</a></p>
</form>
$("#myForm").submit(function(){
var dataString = {};
dataString.login = $("#login").val();
dataString.password = $("#password").val();
$.ajax({
type: 'POST',
url: 'http://localhost:8080/login',
data: JSON.stringify(dataString),
contentType: 'application/json',
dataType: 'json',
success: function(response) {
console.log(response);
},
error: function(response) {
console.log(response);
}
});
});
关于javascript - AJAX - 覆盖提交功能,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44491830/