servlet层
@javax.servlet.annotation.WebServlet(name = "AjaxServlet",urlPatterns = {"/AjaxServlet"})
public class AjaxServlet extends HttpServlet {
???protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
????????String name=request.getParameter("uname");
????????if (name.equals("admin")){
???????????response.getWriter().write("true");
????????}else{
????????????response.getWriter().write("false");
????????}
???}
???protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
??????doPost(request,response);
???}
}
ajax.jsp页面
</head>
<body>
???<form id="form1">
???????<input name="uname"/><span id="msg"></span>
???????<input name="upwd" value="000000"/>
???????<div id="box">
???????</div>
???</form>
</body>
Ajax的提交方式:
<script type="text/javascript" src="js/jquery-1.12.4.js"></script>
<script type="text/javascript">
$(function () {
???$("[name=uname]").blur(function () {
???//ajax提交方法的调用
????newAjax();
});
/**
* ajax方法提交方法
*/
function newAjax() {
???$.ajax({
???????url:"/AjaxServlet",
???????type:"POST",
???????data:{"uname":$("[name=uname]").val()},
???????async:true,
???????success:function (data) {
???????????$("#msg").html(data);
???????}
???});
}
?}
</script>
效果如下:
输入的值与判断的值相同时:
输入的值与判断的值不同:
Ajax高级
原文地址:http://www.cnblogs.com/sujulin/p/7635233.html