jquery 实现异步刷新

　　前两天，我一个同学刚刚开始学习jquery,问我能不能实现不刷新页面和后台的程序实现交互，我说当然可以，然后给他写了一个小的demo，在这里记录一下，希望给新手一些帮助，也为了防止我以后自己忘记了。

 功能很简单，就是前端输入一个数字，传到后台，后台乘以2，再返回到前端页面。从而实现前后端无刷新交互。

前台页面：

　　<script src="jquery-1.10.0.js" ></script>    //这里记住要引用jquery 哦
<script>
function as(){
 var suburl = "main.php";
 var username = $("#num").val();
 $.post(suburl, { username:username})
    .done(function(data) {   
         $("#qq").html(data);
    });
}
</script>
<div>
 <input type="text" id="num"/>
 <input type="button" value="点击" onclick="as()"/><br />
 这里显示你输入值得两倍：
 <div id="qq"></div>
</div>

 

 

PHP代码：

 

<?php
echo $_POST['username']*2;
?>