在使用jquery validate框架时,用 ajax验证用户名是否重复时,怎么显示等待图片

大神们帮我分析下,在使用jquery validate框架时,用 ajax验证用户名是否重复时,怎么显示等待图片
最新回答
想挽无人

2024-05-06 08:15:52

首先,调用 createGcjDhccFullScreen() 生成 fullScreen(全屏覆盖层)
* 然后,
* 调用 showGcjDhccFullScreen() 显示 fullScreen
* 调用 hideGcjDhccFullScreen() 隐藏 fullScreen
*
* ********** 变量说明 **********
* path : 工程路径(该变量需在页面定义或赋值) var path = "<%=path%>";
* gcjDhccFullScreenLoadingText : 设置 fullScreen 层的加载时显示的文字(可以是HTML)
* gcjDhccFullScreenLoadingTextAlign : 设置 fullScreen 层的加载时显示的文字位于加载图片的位置:图片上方 up,下 down,左 left,右 right
* gcjDhccFullScreenLoadingImgHAlign : 设置 fullScreen 层的加载图片的水平位置:左 left,中 center,右 right
* gcjDhccFullScreenLoadingImgVAlign : 设置 fullScreen 层的加载图片的竖直位置:上 top,中 middle,下 bottom
* gcjDhccFullScreenBKImgPath : 设置 fullScreen 层的背景图片路径
* gcjDhccFullScreenLoadingImgPath : 设置 fullScreen 层的加载图片路径
* gcjDhccFullScreenDocumentObj : 设置 fullScreen 层在那个页面显示
* 本页面:var gcjDhccFullScreenDocumentObj = window.document;
* 父页面:var gcjDhccFullScreenDocumentObj = window.parent.document;
* 父页面的父页面:var gcjDhccFullScreenDocumentObj = window.parent.parent.document;
* 依此类推。
*
* 程序缺陷:gcjDhccFullScreenDocumentObj 现在只能设置在本页面,设置在父页面时无法隐藏 fullScreen( hideGcjDhccFullScreen() 隐藏时会报错 )
*
*/
var gcjDhccFullScreenLoadingText = '<font color="#ff0000">加载中 。。。</font>';
var gcjDhccFullScreenLoadingTextAlign = "up";
var gcjDhccFullScreenLoadingImgPath = path +"/images/loadingImg.gif";
var gcjDhccFullScreenLoadingImgHAlign = "center";
var gcjDhccFullScreenLoadingImgVAlign = "middle";
var gcjDhccFullScreenBKImgPath = path +"/images/b.gif";
var gcjDhccFullScreenDocumentObj = window.document;

/**
* 生成 fullScreen(全屏覆盖层)
*
* loadingText = gcjDhccFullScreenLoadingText
* loadingTextAlign = gcjDhccFullScreenLoadingTextAlign
* loadingImgPath = gcjDhccFullScreenLoadingImgPath
* imgHAlign = gcjDhccFullScreenLoadingImgHAlign
* imgVAlign = gcjDhccFullScreenLoadingImgVAlign
* bKImgPath = gcjDhccFullScreenBKImgPath
* documentObj = gcjDhccFullScreenDocumentObj
*
* 不需要改变的参数置空(值为 null ,不是字符串 "null" )
*
*/
function createGcjDhccFullScreen(loadingText, loadingTextAlign, loadingImgPath, imgHAlign, imgVAlign, bKImgPath, documentObj)
{
//初始化变量
if(loadingText == null){ loadingText = gcjDhccFullScreenLoadingText; }
if(loadingTextAlign == null){ loadingTextAlign = gcjDhccFullScreenLoadingTextAlign; }
if(loadingImgPath == null){ loadingImgPath = gcjDhccFullScreenLoadingImgPath; }
if(imgHAlign == null){ imgHAlign = gcjDhccFullScreenLoadingImgHAlign; }
if(imgVAlign == null){ imgVAlign = gcjDhccFullScreenLoadingImgVAlign; }
if(bKImgPath == null){ bKImgPath = gcjDhccFullScreenBKImgPath; }
if(documentObj == null){ documentObj = gcjDhccFullScreenDocumentObj; }
else{gcjDhccFullScreenDocumentObj = documentObj;}

//判断 fullScreen 是否存在
try{
if(documentObj.getElementById("gcjDhccFullScreen")){ return null; }
}
catch(e){ }
//开始生成 fullScreen
var divObj = documentObj.createElement("div");
divObj.setAttribute("id", "gcjDhccFullScreen");
divObj.style.display = "none"; //不可见
divObj.style.position = "absolute"; //浮动
divObj.style.top = 0;
divObj.style.left = 0;
divObj.style.width = documentObj.body.offsetWidth;
divObj.style.height = documentObj.body.offsetHeight;
divObj.style.backgroundImage = "url("+ bKImgPath +")";
divObj.style.zIndex = 999;

var loadingHtml = '<table width="100%" height="100%" align="'+ imgHAlign +'" valign="'+ imgVAlign +'" border="0" cellpadding="0" cellspacing="0">';
loadingHtml += '<tr><td ondblclick="hideGcjDhccFullScreen();" align="'+ imgHAlign +'" valign="'+ imgVAlign +'">';
//图片上方 up,下 down,左 left,右 right
if(loadingTextAlign == "up"){
loadingHtml += '<div align="'+ imgHAlign +'">'+ loadingText +'<div>';
loadingHtml += '<img src="'+ loadingImgPath +'" />';
}
else if(loadingTextAlign == "down"){
loadingHtml += '<img src="'+ loadingImgPath +'" />';
loadingHtml += '<div align="'+ imgHAlign +'">'+ loadingText +'<div>';
}
else if(loadingTextAlign == "left"){
loadingHtml += loadingText +'  ';
loadingHtml += '<img src="'+ loadingImgPath +'" />';
}
else if(loadingTextAlign == "right"){
loadingHtml += '<img src="'+ loadingImgPath +'" />';
loadingHtml += '  '+ loadingText;
}
loadingHtml += '</td></tr>';
loadingHtml += '</table>';

divObj.innerHTML = loadingHtml;

//开始生成 iframe
var iframeObj = documentObj.createElement("iframe");
iframeObj.setAttribute("id", "gcjDhccFullScreenIframe");
iframeObj.style.filter = "progid:DXImageTransform.Microsoft.Alpha(style=0,opacity=0)";

iframeObj.style.display = "none"; //不可见
iframeObj.style.position = "absolute"; //浮动
iframeObj.style.top = 0;
iframeObj.style.left = 0;
iframeObj.style.width = documentObj.body.offsetWidth;
iframeObj.style.height = documentObj.body.offsetHeight;
iframeObj.style.zIndex = 998;

// body 里加入 iframe
documentObj.body.appendChild(iframeObj);

// body 里加入 div
documentObj.body.appendChild(divObj);
}
//显示 fullScreen
function showGcjDhccFullScreen()
{
try{
gcjDhccFullScreenDocumentObj.getElementById("gcjDhccFullScreen").style.display = "block";
gcjDhccFullScreenDocumentObj.getElementById("gcjDhccFullScreenIframe").style.display = "block";
}
catch(e){ window.alert('showGcjDhccFullScreen'); }
}
//隐藏 fullScreen
function hideGcjDhccFullScreen()
{
try{
gcjDhccFullScreenDocumentObj.getElementById("gcjDhccFullScreen").style.display = "none";
gcjDhccFullScreenDocumentObj.getElementById("gcjDhccFullScreenIframe").style.display = "none";
}
catch(e){ window.alert('hideGcjDhccFullScreen'); }
}
/**************************** END ****************************/

//测试方法 -- 调用 test(); 进行测试
function test()
{
createGcjDhccFullScreen('<font style="font-size:15px; color:#ff0000;">加载数据中 。。。</font>', null, null, null, null, null, null);
showGcjDhccFullScreen();
}

/**
* 备注,如果是在form.submit();时显示,可能会出现图片加载不出来。
* 解决方法:可以延时调用form.submit();
*
* 延时调用例:
function test()
{
createGcjDhccFullScreen('<font style="font-size:15px; color:#ff0000;">加载数据中 。。。</font>', null, null, null, null, null, null);
showGcjDhccFullScreen();
setTimeout(formSubmit, 500); //延时调用formSubmit()方法
}
function formSubmit()
{
dataForm.action = "..."; //action如果在form中设置,这行可以不写
dataForm.submit();
}
*
*/