ajax+servlet简单应用

最新推荐文章于 2025-09-08 16:20:27 发布

wqlongxiong

最新推荐文章于 2025-09-08 16:20:27 发布

阅读量365

点赞数

CC 4.0 BY-SA版权

分类专栏： jsp+ajax简单应用文章标签： servlet ajax xmlhttprequest email function string

本文链接：https://blog.youkuaiyun.com/wqlongxiong/article/details/7298714

jsp+ajax简单应用专栏收录该内容

2 篇文章

订阅专栏

本文介绍了一个简单的Ajax应用案例，通过JavaScript与后端Servlet交互，实现用户输入表单的数据验证，并即时反馈验证结果，无需刷新页面。文章详细展示了前端JavaScript代码及后端Java Servlet的实现过程。

protected void doPost(HttpServletRequest req, HttpServletResponse resp)
   throws ServletException, IOException {
  // TODO Auto-generated method stub
   resp.setContentType("text/html;charset=UTF-8");
   req.setCharacterEncoding("utf-8");
   PrintWriter out =resp.getWriter();
   String name=req.getParameter("name");
   String pwd=req.getParameter("pwd");
   String age=req.getParameter("age");
   String email=req.getParameter("email");
   System.out.println("name==="+name );
   System.out.println("pwd==="+pwd );
   System.out.println("age==="+age );
   System.out.println("email==="+email );
   if(name.equals("admin")&&pwd.equals("123")&&age.equals("22")&&email.equals("123")){
    out.print("yes");//ajax传值不能换行
   }else{
    out.print("NO");
   }
  }

<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
  <title>尝试使用JS传值</title>
  <script type="text/javascript">
function a(o) {
alert(o);
alert("今天天气很差！！！");
}
function abcd() {
alert("今天天气很差！！！");
}
function $(id) {
return document.getElementById(id);
}
function createXHR() {
if (typeof XMLHttpRequest != "undefind") {
  return new XMLHttpRequest();
} else if (typeof ActiveXObject != "undefind") {
  if (typeof Arguments.callee.activeXString != "string") {
   var versions = [ "MSXML2.XMLHttp.6.0", "MSXML2.XMLHttp.3.0",
     "MSXML2.XMLHttp" ];
   for ( var i = 0, len = versions.length; i < len; i++) {
    try {
     var xhr = new ActiveXObject(version[i]);
     arguments.callee.activeXString = versions[i];
     return xhr;
    } catch (ex) {
     //跳过
    }
   }
   return new ActiveXObject(arguments.callee.activeXString);
  } else {
   throw new Error("NO XHR object available.");
  }
}
}
function abc() {
var name = $("txtname").value;
var pwd = $("txtpwd").value;
var age = $("txtage").value;
var email = $("txtemail").value;
var xhr = createXHR();
xhr.onreadystatechange = function(event) {
  if (xhr.readyState == 4) {
   if (xhr.status >= 200 && xhr.status < 300 || xhr.status == 304) {
    var result = xhr.responseText;
    alert(result);
    if (result.toString()=="yes") {
     alert("注册成功！");
    } else {
     alert("注册失败！");
    }
   }
  }
}
xhr.open("post", "test?name=" + name + "&pwd=" + pwd + "&age=" + age
   + "&email=" + email, true);
xhr.send(null);
};

</script>
</head>
<body>
  <h1>
   尝试使用JS传值
  </h1>
  <table>
   <tr>
    <td>
     姓名:
    </td>
    <td>
     <input type="text" value="" id="txtname" />
    </td>
   </tr>
   <tr>
    <td>
     密码:
    </td>
    <td>
     <input type="text" value="" id="txtpwd" />
    </td>
   </tr>
   <tr>
    <td>
     年龄：
    </td>
    <td>
     <input type="text" value="" id="txtage" />
    </td>
   </tr>
   <tr>
    <td>
     email:
    </td>
    <td>
     <input type="text" value="" id="txtemail" />
    </td>
   </tr>
  </table>