client_jquery との jQuery Ajax サーバー側通信をシミュレートするコード

機能は次のとおりです:

ユーザー名が空の場合は、「ユーザー名を空にすることはできません」というプロンプトが表示されます

ユーザー名が存在する場合は、「ユーザー名 [xxxxxx] はすでに存在します。別のユーザー名 4 を使用してください」というプロンプトが表示されます。

ユーザー名が存在しない場合は、「ユーザー名 [xxxxxx] はまだ存在しません。このユーザー名を使用して登録できます。5」というプロンプトが表示されます。

操作効果は次のとおりです:

ディレクトリ構造:

サーバー側 AjaxServer

コードをコピー コードは次のとおりです:

package com .ljq.test ;

インポート java.io.PrintWriter;
インポート javax.servlet.ServletException; .servlet.http .HttpServlet;
import javax.servlet.http.HttpServletResponse;
@SuppressWarnings("serial")
public class AjaxServlet extends HttpServlet {
@ Override
protected void doGet(HttpServletRequest request,
HttpServletResponse response) throws ServletException, IOException {
try {
//ページの utf-8 エンコーディングを設定します
response.setContentType(" text/html; charset=utf-8");
PrintWriter out = response.getWriter();
整数合計 = (Integer) request.getSession().getAttribute("total");
int temp = 0;
if (total == null) {
temp = 1;
} else {
temp = total.intValue() 1;
request.getSession ().setAttribute ("total", temp);
// 1. パラメータを取得します
String param = request.getParameter("name");
String name = URLDecoder.decode(param, "UTF) -8") ;
// 2. パラメーターが有効かどうかを確認します
if (param == null || param.length() == 0) {
out.println("ユーザー名はempty");
} else {
// 3. 検証操作
if (name.equals("linjiqin")) {
// 4. 結果データを返す
out.println ("ユーザー名 [" name "] はすでに存在します。別のユーザー名を使用してください、" temp);
} else {
out.println("ユーザー名 [" name "] はまだ存在しません。このユーザー名を使用できます登録するには、" temp);
}
}
} catch (Exception e) {
e.printStackTrace();
}
}
@Override
protected void doPost( HttpServletRequest request,
HttpServletResponse response) throws ServletException, IOException {
doGet(request, response)
}
}


設定 web.xml




コードをコピー

コードは次のとおりです:

<ウェブアプリのバージョン="2.4" xmlns="http://java.sun.com/xml/ns/j2ee" xmlns:xsi="http ://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://java.sun.com/xml/ns/j2ee http://java.sun.com /xml/ns/j2ee/web-app_2_4.xsd">

<サーブレット>

<サーブレット名>AjaxServer
<サーブレットクラス>com.ljq .test.AjaxServer

AjaxServer pattern>/servlet/ajaxServer< /url-pattern>

index.jsp ;



index.jsp ページ



コードをコピー


コードは次のとおりです:

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
文字列パス = request.getContextPath();
StringbasePath = request.getScheme() "://" request.getServerName() ":" request.getServerPort() パス "/";
%>


<頭>












请输入力用户名：

validate.js

复制代代码如下:

function verify() {
// 解决中文乱コード方法一： 页面端発行的データ作一次encodeURI、サービスセグメント使用new String(name.getBytes("iso8859-1"),"UTF-8");
// 解决中文乱码方法二：页面端発行的データ作二次encodeURI，服务器段使用URLDecoder.decode(name,"UTF-8")
var url = "servlet/ajaxServer?name=" encodeURI(encodeURI($("#userName").val()));
//注意url前不要加"/"，否则無法访问url
//var url = "/servlet/ajaxServer?name=" encodeURI(encodeURI($("#userName").val() )); //错误
url = ConvertURL(url);
$.get(url, null, function(data) {
$("#result").html(data);
});
}
// url地址增加時間间戳，骗过浏览器，不读取缓存
function ConvertURL(url) {
// 取得時間间戳
var timstamp = (new Date()).valueOf();
// 将時間间戳情報拼接 URL 上
if (url.indexOf("?") >= 0) {
url = url "&t=" timstamp;
} else {
url = url "?t=" timstamp;
}
URL を返します。
}