電子發燒友App
一、基于jQuery實現的Ajax 驗證用戶名唯一性實例代碼
本文分為jsp代碼和后臺代碼給大家介紹了基于jQuery實現的Ajax 驗證用戶名唯一性，非常不錯，具有參考借鑒價值，需要的的朋友參考下吧JSP部分代碼：
<%@ page contentType="text/html;charset=UTF-8" language="java" %>??<%@include file="/common/header.jsp"%>
??
??
??????
??????
????????
??????
????
后臺代碼：
public class UserDAOImpl extends BaseDaoImpl??/**
???* 校驗賬號唯一性
???*/
??@Override
??public List
????StringBuilder hqlStr = new StringBuilder("FROM User t WHERE t.account = ?");
????if (StringUtils.isNotBlank(id)) {
??????hqlStr.append(" AND t.id=?");
????}
????Query query = getSession().createQuery(hqlStr.toString());
????query.setParameter(0, account);
????if (StringUtils.isNotBlank(id)) {
??????query.setParameter(1, id);
????}
????return query.list();
??}
效果圖：
?二、jQuery+AJAX實現遮罩層登錄驗證界面（附源碼）
操作系統：Windwos7 Ultimate開發工具：Visual Studio 2010
數據庫：Sql Server 2005
測試瀏覽器：IE8、FF3.6.8、Google Chrome?
1、預覽
????1）登錄前
?
????2）點擊登錄顯示登錄窗口（層），同時用一個灰色透明層遮罩主窗體內容，點擊【登錄】，隱藏【登錄】，顯示loading圖，登錄失敗，顯示【登錄】，隱藏登錄圖，同時顯示提示信息
?
????3）登錄成功后，去掉去掉遮罩層和登錄層，顯示“xxx，您好！ ”
?
2、實現
?????使用VS2010創建一個Web Site，此功能是在母版頁Site.master中實現的。VS2010會自動添加JQuery的js文件到Scripts文件夾，并創建一個母版頁和基于此母版頁的Default.aspx和About.aspx兩個窗體。????1）登錄層界面設計，看Site.master中的代碼
<%@ Master Language="C#" AutoEventWireup="true" CodeFile="Site.master.cs" Inherits="SiteMaster" %>?
?
?
?
?
?
?
?
?????2）實現遮罩層和彈出登錄界面的層的js文件Scripts/common.js的代碼，注意，里面硬寫了一些母版頁Site.master中的元素的ID
$(function () {
?var screenwidth, screenheight, mytop, getPosLeft, getPosTop
?screenwidth = $(window).width();
?screenheight = $(window).height();
?//獲取滾動條距頂部的偏移
?mytop = $(document).scrollTop();
?//計算彈出層的left
?getPosLeft = screenwidth / 2 - 200;
?//計算彈出層的top
?getPosTop = screenheight / 2 - 150;
?//css定位彈出層
?$("#divLoginWindow").css({ "left": getPosLeft, "top": getPosTop });
?//當瀏覽器窗口大小改變時
?$(window).resize(function () {
?screenwidth = $(window).width();
?screenheight = $(window).height();
?mytop = $(document).scrollTop();
?getPosLeft = screenwidth / 2 - 200;
?getPosTop = screenheight / 2 - 150;
?$("#divLoginWindow").css({ "left": getPosLeft, "top": getPosTop + mytop });
?});
?//當拉動滾動條時，彈出層跟著移動
?$(window).scroll(function () {
?screenwidth = $(window).width();
?screenheight = $(window).height();
?mytop = $(document).scrollTop();
?getPosLeft = screenwidth / 2 - 200;
?getPosTop = screenheight / 2 - 150;
?$("#divLoginWindow").css({ "left": getPosLeft, "top": getPosTop + mytop });
?});
?//點擊鏈接彈出登錄窗口
?$("#popup").click(function () {
?$("#divLoginWindow").fadeIn("slow"); //toggle("slow");
?$("#txtUserName").focus();
?//獲取頁面文檔的高度
?var docheight = $(document).height();
?//追加一個層，使背景變灰
?$("body").append("");
?$("#greybackground").css({ "opacity": "0.5", "height": docheight });
?return false;
?});
?//點擊關閉按鈕
?$("#closeBtn").click(function () {
?$("#divLoginWindow").fadeOut("slow"); ////hide();
?//刪除變灰的層
?$("#greybackground").remove();
?return false;
?});
});
?
//更換驗證碼圖片
function ChangeCode(obj) {
?obj.src = "Code.aspx?" + Math.random();
}
?
?????3）點擊【登錄】實現AJAX登錄驗證功能的js文件Scripts/login.js的代碼
var count = 0;
$(document).ready(function () {
?$("#loading").hide()
});
?
function CheckLogin() {
?$("#alogin").hide();
?$("#loading").show();
?var txtCode = $("#txtCode");
?var txtName = $("#txtUserName");
?var txtPwd = $("#txtPassword");
?$.ajax({
?url: "CheckLogin.aspx?Code=" + txtCode.val() + "&Name=" + txtName.val() + "&Pwd=" + txtPwd.val(),
?type: "post",
?datatype: "text",
?success: function (returnValue) {
?if (returnValue != "false") {
?$("#popup").hide();
?$("#showMes").hide();
?$("#loginSuccess").html(returnValue + '，您好!');
?$("#divLoginWindow").remove();
?$("#greybackground").remove();
?$("#showMes").hide();
?}
?else {
?count = count + 1;
?$("#loading").hide();
?$("#alogin").show();
?$("#showMes").show();
?$("#showMes").html("登錄失敗，請檢查后重試!(" + count + "次)");
?}
?}
?})
}
?
?
????4）請求的CheckLogin.aspx的后臺代碼，前臺清除剩Page命令一行
using System;
using System.Data;
?
public partial class CheckLogin : System.Web.UI.Page
{
?protected void Page_Load(object sender, EventArgs e)
?{
?try
?{
?String strCode = Request.QueryString["Code"];
?String strName = Request.QueryString["Name"];
?String strPassword = Request.QueryString["Pwd"];
?
?if (strCode != Session["Code"].ToString())
?{
?Response.Write("false");
?}
?else
?{
?DAO.SqlHelper helper = new DAO.SqlHelper();
?DataTable dt = helper.FillDataTable(String.Format("Select UserName,TrueName From Clients Where UserName='{0}' And Password='{1}'",
??strName,
??strPassword
??));
?if (dt != null && dt.Rows.Count > 0)
?{
??Session["TrueName"] = dt.Rows[0]["TrueName"].ToString();
??Response.Write(dt.Rows[0]["TrueName"].ToString());
?}
?else
?{
??Response.Write("false");
?}
?}
?}
?catch
?{
?Response.Write("false");
?}
?}
}
工商網監
評論