码迷,mamicode.com
首页 > Web开发 > 详细

简单的Ajax示例

时间:2015-05-19 18:44:53      阅读:112      评论:0      收藏:0      [点我收藏+]

标签:

<body>
<form action="#" id="form1">
<p>评论:</p>
<p>姓名:<input type="text" name="username" id="username" /></p>
<p>内容:<textarea name="content" id="content" cols="20" rows="2"></textarea></p>
<p><input type="button" id="send" value="提交"/></p>
</form>
<div class="comment">已有评论</div>
<div id="resText">

</div>

<script src="script/jquery-2.1.4.js"></script>
<!--
$.get()方法
结构为:$get(url[,date][,callback][,type])

第一步:使用参数,确定请求页面的url地址。
-->
<script>
$(function(){
$("#send").click(function(){
$.get("test.html",{                                  //确定请求页面的url(test.html页面需要提前定义)
username:$("#username").val(),               //体检前先获取“姓名”和“内容”的值作为data参数传递给后台
content:$("#content").val()
},function(data,textStatus){                    //回调函数(textStatus:请求状态:success、error、notmodified、timeout)
$("#resText").html(data);                        //将返回的数据添加到页面上
});
})
}) 
</script>
</body>

简单的Ajax示例

标签:

原文地址:http://www.cnblogs.com/treeclass/p/4515193.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!