JS 如何獲取radio選中后的值及不選擇取radio的值

更新時(shí)間：2013年10月28日 15:36:45 作者：

獲取radio選中后的值，這在提交頁(yè)面經(jīng)常會(huì)使用到的，在本文為大家介紹下不選擇也能獲取radio的值，具體實(shí)現(xiàn)如下，感興趣的朋友可以參考下

以下是網(wǎng)上摘下的文章（未測(cè)試但很規(guī)范可以模仿）

 
<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=gb2312"> 
<title>text</title> 
<script> 
var chk = 0; 
window.onload=function (){ 
var chkObjs = document.getElementsByName("radio"); 
for(var i=0;i<chkObjs.length;i++){ 
if(chkObjs[i].checked){ 
chk = i; 
break; 
} 
} 
} 
function check_radio(){ 
var chkObjs = document.getElementsByName("radio"); 
for(var i=0;i<chkObjs.length;i++){ 
if(chkObjs[i].checked){ 
if(chk == i){ 
alert("radio值沒有改變不能提交"); 
break; 
} 
} 
} 
} 
</script> 
</head> 
<body> 
<form action='' method='post' onsubmit='javascript:return check_radio()'> 
<input type='radio' value='1' name='radio' checked='checked'>一; 
<input type='radio' value='2' name='radio'>二; 
<input type='radio' value='3' name='radio'>三; 
<input type='radio' value='4' name='radio'>四; 
<input type='radio' value='5' name='radio'>五; 

<input type=submit value=sub > 
</form> 
</body> 
</html> 

下面是不做選擇獲取radio的值

復(fù)制代碼代碼如下:

 
<input type="radio" name="money" value="1" />美元 
<input type="radio" name="money" value="2" />日元 
<input type="radio" name="money" value="3" />歐元 

原生JS方式：（原生DOM操作會(huì)把文本也當(dāng)做一個(gè)節(jié)點(diǎn)，所以會(huì)有nextSibling）

復(fù)制代碼代碼如下:

 
var 美元 = document.getElementsByName("money")[0].nextSibling.nodeValue; 
var 日元 = document.getElementsByName("money")[1].nextSibling.nodeValue; 
var 歐元 = document.getElementsByName("money")[2].nextSibling.nodeValue; 

jQuery方式

復(fù)制代碼代碼如下:

 
$('input[name="money"]:checked').next('span').html(); 

<input type="radio" name="money" value="1" checked="checked" /><span>美元</span> 
<input type="radio" name="money" value="2" /><span>日元</span> 
<input type="radio" name="money" value="3" /><span>歐元</span> 

<!--正常的情況下，創(chuàng)建復(fù)選框或者單選框會(huì)使用label將其鏈接，比如：--> 
<input id="radio1" type="radio" name="money" value="1" /><label for="radio1">美元</label> 

以下要選擇的：

這個(gè)只判斷有沒有選擇

復(fù)制代碼代碼如下:

 
function radioValue(){ 
var radArr = document.getElementsByName("radiov"); 
var radValue = ""; 
//alert(radArr.length); 
for(var i=0; i<radArr.length; i++){ 
//alert(radArr[i].checked+" "+radArr[i].name + " "+ radArr[i].value); 
if(radArr[i].checked){ 
radValue = radArr[i].value; 

} 
} 

if(radValue != null && radValue != ""){ 
alert(radValue); 
}else{ 
alert("請(qǐng)選擇"); 
} 

} 

您可能感興趣的文章:

相關(guān)文章

java遇到微信小程序 "支付驗(yàn)證簽名失敗" 問題解決
這篇文章主要介紹了java遇到微信小程序 "支付驗(yàn)證簽名失敗" 問題解決，文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧
2019-12-12
javascript數(shù)組去重方法匯總
數(shù)組去重復(fù)是一個(gè)常見的需求，我們暫時(shí)考慮同類型的數(shù)組去重復(fù)。主要是理清思路和考慮下性能。以下方法，網(wǎng)上基本都有，這里只是簡(jiǎn)單地總結(jié)一下。
2015-04-04
JavaScript實(shí)現(xiàn)輪播圖片完整代碼
這篇文章主要為大家介紹了JavaScript實(shí)現(xiàn)輪播圖片的完整代碼，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2020-03-03
js實(shí)現(xiàn)圖片點(diǎn)擊左右輪播
本文給大家分享的是使用javascript實(shí)現(xiàn)的圖片左右輪播的代碼，已經(jīng)封裝完畢，使用方法非常簡(jiǎn)單，參考示例，有需要的小伙伴可以參考下。
2015-07-07
JS圖像無(wú)縫滾動(dòng)腳本非常好用
最好用的JS圖像無(wú)縫滾動(dòng)腳本，根據(jù)需要改改寬度和圖像個(gè)數(shù)就可以了,需要的朋友可以參考下
2014-02-02
js-FCC算法-No repeats please字符串的全排列(詳解)
下面小編就為大家?guī)硪黄猨s-FCC算法-No repeats please字符串的全排列(詳解)。小編覺得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧
2017-05-05
JavaScript解析json格式數(shù)據(jù)簡(jiǎn)單示例
這篇文章主要介紹了JavaScript解析json格式數(shù)據(jù)簡(jiǎn)單示例,本文通過for循環(huán)來獲取json結(jié)點(diǎn)數(shù)據(jù),需要的朋友可以參考下
2014-12-12
javascript實(shí)現(xiàn)淘寶幻燈片廣告展示效果
這篇文章主要介紹了javascript實(shí)現(xiàn)淘寶幻燈片廣告展示效果的方法,以實(shí)例形式完整講述了javascript實(shí)現(xiàn)幻燈效果的javascript、css及html實(shí)現(xiàn)技巧,需要的朋友可以參考下
2015-04-04
IE8下關(guān)于querySelectorAll()的問題
在IE8的新特性里，提到了會(huì)支持querySelector()和querySelectorAll()方法，如何使用這里就不說了，只是記錄下我在使用時(shí)遇到一個(gè)問題。
2010-05-05
純javascript實(shí)現(xiàn)圖片延時(shí)加載方法
看到一篇博客說土豆網(wǎng)的圖片是延遲加載的。原理是這樣：頁(yè)面可見區(qū)域以下的圖片先不加載，等到用戶向下滾動(dòng)到圖片位置時(shí)，再進(jìn)行加載。這樣做的好處是當(dāng)頁(yè)面有好幾屏內(nèi)容時(shí)，這樣我們就可以只加載用戶需要看的圖片，減少服務(wù)器向用戶瀏覽器發(fā)送圖片文件所產(chǎn)生的負(fù)荷。
2015-08-08