<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>ajax测试</title>
<script src="js/jquery-2.1.4.min.js" type="text/javascript" charset="utf-8"></script>
<style type="text/css">
span{font-family: sans-serif;font-size: 16px;padding: 10px 20px;}
button{width: 80px;height: 30px;line-height: 30px;background-color: burlywood;font-size: 16px;outline: none;border: none;margin-left: 30px;margin-top: 20px;}
#sub{text-indent: 2rem;margin-top: 20px;font-family: "楷体"}
</style>
</head>
<body>
<h1>nodeJs环境下,ajax请求测试</h1>
<span>姓 名：</span><input type="text" name="name" /><br />
<span>密 码：</span><input type="password" name="paw" /><br />
<span>性 别：</span><input type="radio" name="sex" value="0" /><i>男</i><input type="radio" name="sex" value="1" /><i>女</i><br />
<button id="btn">提交</button>
<div id="sub">
</div>
<script type="text/javascript">
$('#btn').click(function(event) {
$.ajax({
url: '/todata',
type: 'get',
dataType: 'json',
data: {name: $("input[type=text]").val(),paw: $("input[name=paw]").val(),sex: $("input[type=radio]:checked").val()}
})
.done(function(data) {
var jsons = JSON.stringify(data);
$('#sub').html("返回结果是："+jsons);
})
.fail(function() {
console.log("error");
})
.always(function() {
console.log("complete");
});
});
</script>
</body>
</html>
