基于jQuery實現(xiàn)Ajax驗證用戶名是否可用實例
更新時間：2018年03月25日 12:02:21 作者：a772304419
這篇文章主要為大家詳細介紹了基于jQuery實現(xiàn)Ajax驗證用戶名是否可用實例，具有一定的參考價值，感興趣的小伙伴們可以參考一下
本文實例為大家分享了jQuery ajax簡單案例-驗證用戶名是否可用的具體代碼，供大家參考，具體內(nèi)容如下
HTML
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript" src="/jquery_ajax/js/jquery-1.8.3.js"></script>
<script type="text/javascript">
//頁面加載完成后
$(function() {
//添加失焦事件
$("#username").blur(function() {
//獲取錄入的用戶名
var usernamevalue = $("#username").val();
//向服務(wù)器發(fā)送請求
var url="/jquery_ajax/load";
$("#username_span").load(url,{'username':usernamevalue});
});
});
</script>
</head>
<body>
<input type="text" name="username" id="username"><span id="username_span"></span>
<br>
<input type="password" name="password">
<br>
</body>
</html>
LoginServlet
public class LoadServlet extends HttpServlet {
public void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
// 解決亂碼
request.setCharacterEncoding("utf-8");
response.setCharacterEncoding("utf-8");
// 1.得到用戶名
String username = request.getParameter("username");
// 2.判斷用戶名是否可以使用
if ("tom".equals(username)) {
// 用戶名不可以使用
response.getWriter().write("<font color='red'>用戶名被占用</font>");
} else {
// 用戶名可以使用
response.getWriter().write("<font color='green'>用戶名可以使用</font>");
}
}
public void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
doGet(request, response);
}
}
web.xml
<servlet>
<description></description>
<display-name>LoadServlet</display-name>
<servlet-name>LoadServlet</servlet-name>
<!--
Class clazz = Class.forName("com.zxl.servlet.LoadServlet");
Object obj = clazz.newInstatnce();
// 反射去調(diào)用 doGet, doPost
-->
<servlet-class>com.zxl.servlet.LoadServlet</servlet-class>
</servlet>
<servlet-mapping>
<servlet-name>LoadServlet</servlet-name>
<url-pattern>/load</url-pattern>
</servlet-mapping>
以上就是本文的全部內(nèi)容，希望對大家的學習有所幫助，也希望大家多多支持腳本之家。
相關(guān)文章
兩個運算符雖然比較相似，其實區(qū)別還是非常大的，雖然不難區(qū)別，但是對于初學者可能稍有困擾，下面就簡單介紹一下它們兩者的區(qū)別，希望對需要的朋友有所幫助2014-01-01
Tinymce+jQuery.Validation使用產(chǎn)生的BUG
在IE6下，當頁面有advanced模式的Tinymce編輯器，并且，并且jquery.validation使用了jquery.metadata時會出現(xiàn)以下問題2010-03-03
這篇文章主要介紹了JQuery Ajax如何實現(xiàn)注冊檢測用戶名,文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值,需要的朋友可以參考下2020-09-09
jquery實現(xiàn)的讓超出顯示范圍外的導航自動固定屏幕最頂上
經(jīng)常會遇到這樣的情況，當頁面展示內(nèi)容過長時，想點導航切換欄目，就得把滾動條拉回到頂上，這樣操作總不太人性化，能不能讓導航超出顯示范圍外時自動貼在屏幕最頂上呢？答案肯定是能的。如果不太明白，把滾動條拉到下面點，看下我博客是效果就明白了。2011-09-09
本文給大家分享一段簡單的jquery代碼實現(xiàn)一個簡單易懂的彈出框，非常不錯，具有參考借鑒價值，感興趣的朋友一起學習吧2016-07-07
最近在做手機上的web app，很多場景需要使用到類似tab切換和圖片輪播的東西，需要支持手勢和鼠標點擊的，于是就基于jquery弄了一個，每一個參數(shù)有詳細的說明2012-07-07
下面小編就為大家?guī)硪黄猨Query之簡單的表單驗證實例。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2016-07-07
本文主要介紹了使用jQuery操作DOM的方法，具有很好的參考價值，下面跟著小編一起來看下吧2017-02-02
在一個客戶的case中遇到需要在SharePoint Calendar試圖里面根據(jù)一定的規(guī)則來顯示或者隱藏記錄，為了取得記錄的handle，可以通過超鏈接選擇器來查找2011-05-05
jquery操作復(fù)選框(checkbox)的12個小技巧總結(jié)
本篇文章主要是對jquery操作復(fù)選框(checkbox)的12個小技巧進行了總結(jié)介紹，需要的朋友可以過來參考下，希望對大家有所幫助2014-02-02