<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>使用AJAX技术无刷新提交数据到服务器</title>
</head>
<!-- 表单id为form_1，姓名输入框id为name，name为name。
提交按钮类型为button，id为b_1，点击提交数据到服务器,提交方式post
提交成功后，把服务器返回的数据显示在div中,div的id为div_1
服务器处理程序的地址为"/public_libs/server_ajax_post_1.php"
jquery的引入地址为"/public_libs/jquery.js"（注此项非强制,可用原生代码实现） -->
<body>
<form id="form_1" action="" method="post">
姓名：<input type="text" name="name" id="name" />
<input type="button" id="b_1" value="" />
</form>
<div id="div_1"></div>
</body>
<script src="/public_libs/jquery.js"></script>
<script>
// serialize() 方法通过序列化表单值创建 URL 编码文本字符串。
$("#b_1").click(function() {
$.ajax({
url: '/public_libs/server_ajax_post_1.php',
type: "POST",
data: $('#form_1').serialize(),
success: function(name) {
$("#div_1").text(name);
}
});
});
</script>
</html>
扫一扫
778
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
