JQuery form表單提交前驗(yàn)證單選框是否選中、刪除記錄時(shí)驗(yàn)證經(jīng)驗(yàn)總結(jié)(整理)

更新時(shí)間：2017年06月09日 11:07:02 作者：水山奇

這篇文章主要介紹了JQuery form表單提交前驗(yàn)證單選框是否選中、刪除記錄時(shí)驗(yàn)證經(jīng)驗(yàn)總結(jié)，非常不錯(cuò)，具有參考借鑒價(jià)值，需要的朋友參考下吧

先上三張效果圖：

表單提交前驗(yàn)證所有字段
驗(yàn)證單選框是否選中
刪除前確認(rèn)一下

這些功能在Java Web開發(fā)中可能是經(jīng)常需要的，雖然很簡(jiǎn)單卻使很實(shí)用的功能，這里記錄下以免忘記。

1. 先說表單提交前驗(yàn)證：后臺(tái)經(jīng)常用到（這里是提交后統(tǒng)一驗(yàn)證，及時(shí)驗(yàn)證請(qǐng)參考我另一篇文章

http://blog.csdn.net/jianzhonghao/article/details/52503431）

1.1 通過submit 按鈕提交后會(huì)根據(jù)form的屬性action=“路徑”來跳轉(zhuǎn)到相應(yīng)的路徑，這時(shí)，給form添加一個(gè) onsubmit =”return check()” 屬性， check()使我們要寫的驗(yàn)證函數(shù)，如下圖：

 <form action="路徑" onsubmit="return check()" method="POST">

1.2 check()函數(shù)如下(驗(yàn)證姓名是否填寫與單選框性別是否選中) $(‘#notice') 的話，隨便寫個(gè)div加個(gè)id屬性就好了

<script type="text/javascript"> 
 function check(){
  var name = $('#name').val().trim();
  var gender=$('input:radio[name="gender"]:checked').val();
  if(!name){
   $('#notice').text('客服名稱不能為空！').show();
   return false;
  }else if(!gender){
   $('#notice').text('請(qǐng)選擇客服性別！').show();
   return false;
  }
  else{
   return true;
  }
 }
</script>
<div id="notice" style="font-size: 30px;color:red;margin-top: 15px;" ></div>

1.3最后說一下刪除時(shí)，確認(rèn)是否刪除的問題

<input type="image" src="刪除圖標(biāo)的路徑" title="刪除" onclick="{if(confirm('確定刪除嗎?')){javascript:document:delfrom_${ServerInfo.id };return true;}return false;}">
分開寫實(shí)際就是
if(confirm('確定刪除嗎?')){
 {javascript:document:delfrom_${ServerInfo.id };
 return true;
}
 return false;

以上所述是小編給大家介紹的JQuery form表單提交前驗(yàn)證單選框是否選中、刪除記錄時(shí)驗(yàn)證經(jīng)驗(yàn)總結(jié)，希望對(duì)大家有所幫助，如果大家有任何疑問請(qǐng)給我留言，小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)腳本之家網(wǎng)站的支持！

您可能感興趣的文章:

相關(guān)文章

jQuery實(shí)現(xiàn)雪花飄落效果
這篇文章主要為大家詳細(xì)介紹了jQuery實(shí)現(xiàn)雪花飄落效果，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2020-08-08
使用jQuery UI的tooltip函數(shù)修飾title屬性的氣泡懸浮框
使用jQuery UI的tooltip()函數(shù)，可以使懸浮提示框不再那么千篇一律，以下是完整的代碼，感興趣的朋友可以參考下哈，希望對(duì)大家有所幫助
2013-06-06
使用jquery實(shí)現(xiàn)select添加實(shí)現(xiàn)后臺(tái)權(quán)限添加的效果
使用jquery實(shí)現(xiàn)select添加實(shí)現(xiàn)后臺(tái)權(quán)限添加的效果，需要的朋友可以參考下。
2011-05-05
遍歷json獲得數(shù)據(jù)的幾種方法小結(jié)
下面小編就為大家?guī)硪黄闅vjson獲得數(shù)據(jù)的幾種方法小結(jié)。小編覺得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧
2017-01-01
jquery獲取當(dāng)前點(diǎn)擊對(duì)象的value方法
這篇文章主要介紹了jquery如何獲取當(dāng)前點(diǎn)擊對(duì)象的value,需要的朋友可以參考下
2014-02-02
jQuery結(jié)合ajax實(shí)現(xiàn)動(dòng)態(tài)加載文本內(nèi)容
本文實(shí)例講述了jquery通過ajax加載一段文本內(nèi)容的方法。分享給大家供大家參考。這是一個(gè)簡(jiǎn)單的例子，注意編碼問題，否則可能會(huì)出現(xiàn)亂碼。
2015-05-05
jquery如何判斷表格同一列不同行input數(shù)據(jù)是否重復(fù)
這篇文章主要介紹了jquery如何判斷表格同一列不同行input數(shù)據(jù)是否重復(fù),需要的朋友可以參考下
2014-05-05
jQuery實(shí)現(xiàn)的跨容器無縫拖動(dòng)效果代碼
這篇文章主要介紹了jQuery實(shí)現(xiàn)的跨容器無縫拖動(dòng)效果代碼,可實(shí)現(xiàn)容器的任意添加與拖動(dòng)功能,涉及jQuery UI插件的使用技巧,需要的朋友可以參考下
2016-06-06
jQuery+css實(shí)現(xiàn)百度百科的頁(yè)面導(dǎo)航效果
這篇文章主要介紹了jQuery+css實(shí)現(xiàn)百度百科的頁(yè)面導(dǎo)航效果,需要的朋友可以參考下
2014-12-12
收集的10個(gè)免費(fèi)的jQuery相冊(cè)
或許在網(wǎng)絡(luò)上你已經(jīng)見過數(shù)百種通過jQuery實(shí)現(xiàn)的相冊(cè)，但是我們發(fā)現(xiàn)的這些相冊(cè)，他們有額外的東西，優(yōu)雅和獨(dú)特的創(chuàng)意！每個(gè)相冊(cè)都是可在線預(yù)覽和免費(fèi)下載的。你可以為你的Web項(xiàng)目添加色彩。
2011-02-02