js控制radio選中、不可選和改變事件實(shí)例代碼
更新時(shí)間：2023年07月03日 12:05:05 作者：初生的太陽(yáng)丶
這篇文章主要給大家介紹了關(guān)于js控制radio選中、不可選和改變事件的相關(guān)資料,我們經(jīng)常會(huì)遇到j(luò)s控制radio選中和切換的問(wèn)題,需要的朋友可以參考下
聲明：網(wǎng)上的資料雜七雜八的搞得我一個(gè)不熟悉前端的后端開(kāi)發(fā)者弄起來(lái)賊難受，現(xiàn)在將實(shí)現(xiàn)了的做一個(gè)整合，希望能給你們帶來(lái)點(diǎn)幫助（主要還是幫助我自己(●ˇ∀ˇ●)，防止丟失）
html代碼組件示例
<div>
<input type="radio" name="cgmd" value="學(xué)習(xí)" checked="checked"><span class="cgsySpan">學(xué)習(xí)</span>
<input type="radio" name="cgmd" value="探親"><span class="cgsySpan">探親</span>
<input type="radio" name="cgmd" value="商務(wù)"><span class="cgsySpan">商務(wù)</span>
<input type="radio" name="cgmd" value="勞務(wù)"><span class="cgsySpan">勞務(wù)</span>
<input type="radio" name="cgmd" value="旅行"><span class="cgsySpan">旅行</span>
<input type="radio" name="cgmd" value="其他"><span>其他</span>
</div>radio設(shè)置選中
var obj = document.getElementsByName("cgmd");//獲取組件
for (var i=0;i<obj.length;i++){
//判斷值
if(obj[i].value == '學(xué)習(xí)'){
//設(shè)置選中
obj[i].checked = true;
}
}radio設(shè)置不可選
var obj = document.getElementsByName("cgmd");//獲取組件
// 設(shè)置所有不可選
for (var i=0;i<obj.length;i++){
obj[i].disabled = true;
}radio讀取某值時(shí)選中其他radio變?yōu)椴豢蛇x(用于讀取數(shù)據(jù)時(shí))
var CGMD = '探親'
var obj = document.getElementsByName("cgmd");//獲取組件
for (var i=0;i<obj.length;i++){
//判斷值
if(obj[i].value == CGMD){
//設(shè)置選中
obj[i].checked = true;
}else{
//設(shè)置不可選
obj[i].disabled= true;
}
}radio值發(fā)生改變事件
$('input[type=radio][name=cgmd]').change(function() {
console.log(this.value);
});總結(jié)
到此這篇關(guān)于js控制radio選中、不可選和改變事件的文章就介紹到這了,更多相關(guān)js控制radio選中事件內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！
相關(guān)文章
在JS中，對(duì)于對(duì)象類型的變量的引用是通過(guò)類似C之類的“指針”的方式來(lái)操作的，及如果多個(gè)變量引用同一個(gè)對(duì)象，則任意一個(gè)變量對(duì)對(duì)象的操作都會(huì)影響到其它的變量。2010-03-03
微信自定義分享鏈接信息（標(biāo)題，圖片和內(nèi)容）實(shí)現(xiàn)過(guò)程詳解
這篇文章主要介紹了微信自定義分享鏈接信息（標(biāo)題，圖片和內(nèi)容）實(shí)現(xiàn)過(guò)程詳解,文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下2019-09-09
javascript的創(chuàng)建多行字符串的7種方法
多行字符串的作用是用來(lái)提高源代碼的可讀性.尤其是當(dāng)你處理預(yù)定義好的較長(zhǎng)字符串時(shí),把這種字符串分成多行書(shū)寫(xiě)更有助于提高代碼的可讀性和可維護(hù)性.在一些語(yǔ)言中,多行字符串還可以用來(lái)做代碼注釋. 大部分動(dòng)態(tài)腳本語(yǔ)言都支持多行字符串,比如Python, Ruby, PHP. 但Javascript呢?2014-04-04
利用JS響應(yīng)式修改vue實(shí)現(xiàn)頁(yè)面的input值
這篇文章主要給大家介紹了關(guān)于如何利用JS響應(yīng)式修改vue實(shí)現(xiàn)頁(yè)面的input值，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家學(xué)習(xí)或者使用JS具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2019-09-09
下面小編就為大家?guī)?lái)一篇js 事件的傳播機(jī)制(實(shí)例講解)。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2017-07-07
使用canvas繪圖音樂(lè)頻譜示例及技術(shù)分析
這篇文章主要為大家介紹了使用canvas實(shí)現(xiàn)音樂(lè)頻譜示例及技術(shù)分析,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2023-12-12
這篇文章主要給大家介紹了關(guān)于微信小程序?qū)W習(xí)之自定義滾動(dòng)彈窗的相關(guān)資料，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2020-12-12
基于javascript實(shí)現(xiàn)最簡(jiǎn)單的選項(xiàng)卡切換效果
這篇文章主要介紹了基于javascript實(shí)現(xiàn)最簡(jiǎn)單的選項(xiàng)卡切換效果的相關(guān)資料，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2016-05-05
這篇文章主要介紹了JS打字效果的動(dòng)態(tài)菜單，推薦給大家，有需要的小伙伴可以參考下。2015-08-08
js如何實(shí)現(xiàn)設(shè)計(jì)模式中的模板方法
都知道在js中如果定義兩個(gè)相同名稱的方法，前一個(gè)方法就會(huì)被后一個(gè)方法覆蓋掉，使用此特點(diǎn)就可以實(shí)現(xiàn)模板方法，感興趣的朋友可以了解下本文哈2013-07-07