js控制radio选中、不可选和改变事件

声明:网上的资料杂七杂八的搞得我一个不熟悉前端的后端开发者弄起来贼难受,现在将实现了的做一个整合,希望能给你们带来点帮助(主要还是帮助我自己(●ˇ∀ˇ●),防止丢失)

html代码组件示例

<div>
	<input type="radio" name="cgmd" value="学习" checked="checked"><span class="cgsySpan">学习</span>
    <input type="radio" name="cgmd" value="探亲"><span class="cgsySpan">探亲</span>
    <input type="radio" name="cgmd" value="商务"><span class="cgsySpan">商务</span>
    <input type="radio" name="cgmd" value="劳务"><span class="cgsySpan">劳务</span>
    <input type="radio" name="cgmd" value="旅行"><span class="cgsySpan">旅行</span>
    <input type="radio" name="cgmd" value="其他"><span>其他</span>
</div>

radio设置选中

var obj = document.getElementsByName("cgmd");//获取组件
for (var i=0;i<obj.length;i++){
    
    
	//判断值
   if(obj[i].value == '学习'){
    
    
   		//设置选中
        obj[i].checked = true;
    }
}

radio设置不可选

var obj = document.getElementsByName("cgmd");//获取组件
// 设置所有不可选
for (var i=0;i<obj.length;i++){
    
    
	obj[i].disabled = true;
}

radio读取某值时选中其他radio变为不可选(用于读取数据时)

var CGMD = '探亲'
var obj = document.getElementsByName("cgmd");//获取组件
for (var i=0;i<obj.length;i++){
    
    
	//判断值
   if(obj[i].value == CGMD){
    
    
   		//设置选中
        obj[i].checked = true;
    }else{
    
    
    	//设置不可选
    	obj[i].disabled= true;
    }
}

radio值发生改变事件

$('input[type=radio][name=cgmd]').change(function() {
    
    
	console.log(this.value);
});

猜你喜欢

转载自blog.csdn.net/Strive279/article/details/129421628
今日推荐