用 Javascript 驗(yàn)證表單(form)中的單選(radio)值
更新時(shí)間:2009年09月08日 20:49:14 作者:
在用 Javascript 驗(yàn)證表單(form)中的單選框(radio)是否選中時(shí),很多新手都會(huì)遇到問題,原因是 radio 和普通的文本框在獲取值的時(shí)候有很大不同.
本文介紹了一個(gè)較為通用的獲取 radio 值的方法,希望對(duì)新手有用。
<script type="text/javascript">
// 說明: 用 Javascript 驗(yàn)證表單(form)中的單選(radio)值
// 作者: CodeBit
function getRadioValue(radio)
{
if (!radio.length && radio.type.toLowerCase() == 'radio')
{ return (radio.checked)?radio.value:''; }
if (radio[0].tagName.toLowerCase() != 'input' ||
radio[0].type.toLowerCase() != 'radio')
{ return ''; }
var len = radio.length;
for(i=0; i<len; i++)
{
if (radio[i].checked)
{
return radio[i].value;
}
}
return '';
}
</script>
radio 和 checkbox 一樣,都是 name 相同,值有多個(gè),在獲取 radio 值的時(shí)候,我們不能按照普通文本框 .value 的方式,而是要判斷哪個(gè)被選中了。
當(dāng)一組 radio 有多個(gè)選項(xiàng)時(shí),我們可以通過循環(huán),以 radio[i] 的方式判斷某個(gè)選項(xiàng)是否被選中來返回值,但是當(dāng)一組 radio 只有一個(gè)選項(xiàng)時(shí),獲取值的方式又有變化,代碼中以 return (radio.checked)?radio.value:''; 這樣的方式直接判斷是否選中,然后返回對(duì)應(yīng)值。
上面的代碼傳入的參數(shù)是 radio 對(duì)象,如:
var radioTest = document.forms['testForm'].elements['radioTest'];
if (getRadioValue(radioTest) == '')
{ ...... }
根據(jù)判斷結(jié)果執(zhí)行你想要的操作。
復(fù)制代碼 代碼如下:
<script type="text/javascript">
// 說明: 用 Javascript 驗(yàn)證表單(form)中的單選(radio)值
// 作者: CodeBit
function getRadioValue(radio)
{
if (!radio.length && radio.type.toLowerCase() == 'radio')
{ return (radio.checked)?radio.value:''; }
if (radio[0].tagName.toLowerCase() != 'input' ||
radio[0].type.toLowerCase() != 'radio')
{ return ''; }
var len = radio.length;
for(i=0; i<len; i++)
{
if (radio[i].checked)
{
return radio[i].value;
}
}
return '';
}
</script>
radio 和 checkbox 一樣,都是 name 相同,值有多個(gè),在獲取 radio 值的時(shí)候,我們不能按照普通文本框 .value 的方式,而是要判斷哪個(gè)被選中了。
當(dāng)一組 radio 有多個(gè)選項(xiàng)時(shí),我們可以通過循環(huán),以 radio[i] 的方式判斷某個(gè)選項(xiàng)是否被選中來返回值,但是當(dāng)一組 radio 只有一個(gè)選項(xiàng)時(shí),獲取值的方式又有變化,代碼中以 return (radio.checked)?radio.value:''; 這樣的方式直接判斷是否選中,然后返回對(duì)應(yīng)值。
上面的代碼傳入的參數(shù)是 radio 對(duì)象,如:
復(fù)制代碼 代碼如下:
var radioTest = document.forms['testForm'].elements['radioTest'];
if (getRadioValue(radioTest) == '')
{ ...... }
根據(jù)判斷結(jié)果執(zhí)行你想要的操作。
您可能感興趣的文章:
- Js得到radiobuttonlist選中值的兩種方法(推薦)
- js判斷radiobuttonlist的選中值顯示/隱藏其它模塊的實(shí)現(xiàn)方法
- js獲取RadioButtonList的Value/Text及選中值等信息實(shí)現(xiàn)代碼
- javascript RadioButtonList獲取選中值
- js中獲取jsp表單中radio類型的值簡(jiǎn)單實(shí)例
- JavaScript中獲取Radio被選中的值
- js獲取 type=radio 值的方法
- JS 如何獲取radio選中后的值及不選擇取radio的值
- 用js的for循環(huán)獲取radio選中的值
- js 獲取radio按鈕值的實(shí)例
- javascript radio值獲取代碼
- JavaScript獲取radio選中值的幾種常用方法小結(jié)
相關(guān)文章
用javascript將數(shù)據(jù)庫中的TEXT類型數(shù)據(jù)動(dòng)態(tài)賦值到TEXTAREA中
用javascript將數(shù)據(jù)庫中的TEXT類型數(shù)據(jù)動(dòng)態(tài)賦值到TEXTAREA中...2007-04-04模擬用戶操作Input元素,不會(huì)觸發(fā)相應(yīng)事件
模擬用戶操作Input元素,不會(huì)觸發(fā)相應(yīng)事件...2007-05-05用javascript來實(shí)現(xiàn)select標(biāo)簽的美化的代碼
用javascript來實(shí)現(xiàn)select標(biāo)簽的美化的代碼...2007-10-10javascript之文本框輸入四個(gè)數(shù)字自動(dòng)加空格的腳本
javascript之文本框輸入四個(gè)數(shù)字自動(dòng)加空格的腳本...2007-11-11同一個(gè)表單 根據(jù)要求遞交到不同頁面的實(shí)現(xiàn)方法小結(jié)
同一個(gè)表單 根據(jù)要求遞交到不同頁面的實(shí)現(xiàn)方法,就是好多網(wǎng)站,可以百度一個(gè)表單可以搜索音樂,圖片等2009-08-08