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.ajax向后臺(tái)傳遞數(shù)組問題的解決方法
這篇文章主要為大家詳細(xì)介紹了jQuery.ajax向后臺(tái)傳遞數(shù)組問題的解決方法，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2017-05-05
本文主要對(duì)jQuery的基礎(chǔ)知識(shí)進(jìn)行介紹，非常適合剛開始接觸JQuery學(xué)習(xí)的朋友們，下面就跟小編一起來看下吧2016-12-12
使用JQuery實(shí)現(xiàn)Ctrl+Enter提交表單的方法
這篇文章主要介紹了使用JQuery實(shí)現(xiàn)Ctrl+Enter提交表單的方法，需要的朋友可以參考下2015-10-10
基于jquery編寫的橫向自適應(yīng)幻燈片切換特效的實(shí)例代碼
全屏自適應(yīng)jquery焦點(diǎn)圖切換特效,在IE6這個(gè)瀏覽器兼容性問題上得到了和諧,兼容IE6,適用瀏覽器：IE6、IE7、IE8、360、FireFox、Chrome、Safari、Opera、傲游、搜狗、世界之窗.相關(guān)代碼2013-08-08
好的代碼會(huì)帶來速度的提升，快速渲染和響應(yīng)意味著更好的用戶體驗(yàn)。本文主要總結(jié)了如何高效的編寫jQuery代碼的技巧，對(duì)提升你的jQuery和javascript代碼具有很好的參考價(jià)值，下面跟著小編一起來看下吧2017-02-02
使用BootStrap和Metroui設(shè)計(jì)的metro風(fēng)格微網(wǎng)站或手機(jī)app界面
今天使用bootstrap和metroui設(shè)計(jì)了一個(gè)metro風(fēng)格的移動(dòng)app或者微信微網(wǎng)站的界面，非常不錯(cuò)具有參考借鑒價(jià)值，感興趣的朋友可以參考下2016-10-10
JQuery搜索框自動(dòng)補(bǔ)全(模糊匹配)功能實(shí)現(xiàn)示例
這篇文章主要介紹了JQuery搜索框自動(dòng)補(bǔ)全(模糊匹配)功能實(shí)現(xiàn)示例沒使用JQuery UI的autocomplete插件，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2019-01-01
jquery獲取復(fù)選框checkbox的值實(shí)現(xiàn)方法
下面小編就為大家?guī)硪黄猨query獲取復(fù)選框checkbox的值實(shí)現(xiàn)方法。小編覺得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2016-05-05
jquery統(tǒng)計(jì)輸入文字的個(gè)數(shù)并對(duì)其進(jìn)行判斷
判斷輸入文字個(gè)數(shù)并提示還可以輸入多少個(gè)字，類似的功能使用jquery便可輕松實(shí)現(xiàn)2014-01-01
juqery 學(xué)習(xí)之三 選擇器 子元素與表單
juqery 學(xué)習(xí)之三 選擇器 子元素與表單，學(xué)習(xí)jquery的朋友可以參考下。2010-11-11