jquery中輸入驗(yàn)證中一個(gè)不錯(cuò)的效果
更新時(shí)間：2010年08月21日 13:38:05 作者：
在表單的輸入驗(yàn)證中，經(jīng)常要當(dāng)用戶沒能正確輸入后，要提示“XXXX輸入錯(cuò)誤”這一類的信息，如何能搞到動(dòng)態(tài)一點(diǎn)呢，今天發(fā)現(xiàn)jquery中的一個(gè)不錯(cuò)的效果，筆記之。
1 包含jquery
<script src="images/jquery-1.2.6.min.js" type="text/javascript"></script>
<script src="images/jquery.form.js" type="text/javascript"></script>
2 設(shè)置
<div id="msg"></div></td>
3 JAVASCRIPT設(shè)置
<script type="text/javascript">
<!--
$(function(){
$('#msg').hide();
var options = {
target: '#msg',
url: 'XXXX.ACTION',
beforeSubmit: function(){
if($('#company').val()==''){
$('#msg').html("<span class=\"about_content_title\">[公司名稱]不能為空!</span>");
$('#msg').show(1000);
$('#msg').hide(3000);
return false;
}
$('#msg').html("<img src=\"images/loading.gif\" /><span class=\"about_content_title\"> 資料保存中，請(qǐng)稍候。。。</span>");
$('#msg').show(1000);
}
success: function() {
$('#msg').html("<span class=\"about_content_title\">資料保存成功!</span>");
$('#msg').show(1000);
$('#myform').resetForm();
$('#msg').hide(3000);
}
};
$('#myform').ajaxForm(options);
});
-->
</script>
復(fù)制代碼 代碼如下:
<script src="images/jquery-1.2.6.min.js" type="text/javascript"></script>
<script src="images/jquery.form.js" type="text/javascript"></script>
2 設(shè)置
<div id="msg"></div></td>
3 JAVASCRIPT設(shè)置
復(fù)制代碼 代碼如下:
<script type="text/javascript">
<!--
$(function(){
$('#msg').hide();
var options = {
target: '#msg',
url: 'XXXX.ACTION',
beforeSubmit: function(){
if($('#company').val()==''){
$('#msg').html("<span class=\"about_content_title\">[公司名稱]不能為空!</span>");
$('#msg').show(1000);
$('#msg').hide(3000);
return false;
}
$('#msg').html("<img src=\"images/loading.gif\" /><span class=\"about_content_title\"> 資料保存中，請(qǐng)稍候。。。</span>");
$('#msg').show(1000);
}
success: function() {
$('#msg').html("<span class=\"about_content_title\">資料保存成功!</span>");
$('#msg').show(1000);
$('#myform').resetForm();
$('#msg').hide(3000);
}
};
$('#myform').ajaxForm(options);
});
-->
</script>
相關(guān)文章
jquery.validate使用攻略 第五步 正則驗(yàn)證
一些常用的驗(yàn)證腳本2010-07-07
有時(shí),要實(shí)現(xiàn)對(duì)于一篇文章的關(guān)鍵詞部分的提示,想實(shí)現(xiàn)的效果比如是,當(dāng)鼠標(biāo)移動(dòng)到這個(gè)關(guān)鍵詞時(shí),彈出相關(guān)的一段文字或圖片的介紹。2010-01-01
Jquery 動(dòng)態(tài)循環(huán)輸出表格具體方法
這篇文章主要介紹了Jquery 動(dòng)態(tài)循環(huán)輸出表格具體方法，有需要的朋友可以參考一下2013-11-11
jQuery 類twitter的文本字?jǐn)?shù)限制帶提示效果插件
基于jquery的仿twitter的文本字?jǐn)?shù)限制帶提示效果插件，這里提示比較好，不是簡單的限制，給用戶更好的體驗(yàn)。2010-04-04
基于jquery的劃詞搜索實(shí)現(xiàn)（備忘）
最近，需要做個(gè)劃詞搜索功能。在網(wǎng)上找了好些，最后，參照進(jìn)行修改，實(shí)現(xiàn)了想要的功能。這里，做個(gè)記錄，以備日后所用。2010-09-09
jQuery Ajax傳值到Servlet出現(xiàn)亂碼問題的解決方法
jquery ajax 傳值給Servlet,在Servlet里Get接受參數(shù)亂碼,怎么解決呢？下面小編給大家?guī)砹薺query ajax傳值到Servlet出現(xiàn)亂碼問題的解決方法，一起看看吧2016-10-10
本文主要介紹了Jqprint實(shí)現(xiàn)頁面打印的具體方法，并提供了Jqprint插件下載。具有一定的參考價(jià)值，下面跟著小編一起來看下吧2017-01-01
冒泡事件就是點(diǎn)擊子節(jié)點(diǎn)，會(huì)向上觸發(fā)父節(jié)點(diǎn)，祖先節(jié)點(diǎn)的點(diǎn)擊事件，有需要的朋友可以參考一下2013-10-10
jquery插件開發(fā)注意事項(xiàng)小結(jié)
Jquery是繼prototype之后又一個(gè)優(yōu)秀的Javascrīpt框架。它是輕量級(jí)的js庫(壓縮后只有21k) ，它兼容CSS3，還兼容各種瀏覽器 (IE 6.0+, FF 1.5+, Safari 2.0+, Opera 9.0+)2013-06-06
基于jquery css3實(shí)現(xiàn)點(diǎn)擊動(dòng)畫彈出表單源碼特效
這篇文章主要介紹了基于jquery css3實(shí)現(xiàn)點(diǎn)擊動(dòng)畫彈出表單,彈出的表單沒有任何遮蓋層，在web前端程序開發(fā)中經(jīng)常會(huì)用到，需要的朋友可以參考下2015-08-08