html复选框实现单选效果JS实现

最新推荐文章于 2022-08-07 17:28:14 发布

weixin_33811961

最新推荐文章于 2022-08-07 17:28:14 发布

阅读量410

点赞数 1

文章标签：前端 ViewUI

原文链接：https://my.oschina.net/dyl226/blog/919018

版权

为什么80%的码农都做不了架构师？>>>

Html

<div style="line-height: 4"><strong>类型：</strong>
				<label><input name="companytype" type="checkbox"  onclick="removeCompanyChecked(this)" value="1"/><span class="rdContent">&nbsp;&nbsp;A.国</span> </label>&nbsp;&nbsp;
				<label><input name="companytype" type="checkbox"  onclick="removeCompanyChecked(this)" value="2"/><span class="rdContent">&nbsp;&nbsp;B.民</span> </label>&nbsp;&nbsp;
				<label><input name="companytype" type="checkbox" onclick="removeCompanyChecked(this)"  value="3"/><span class="rdContent">&nbsp;&nbsp;C.合</span> </label>&nbsp;&nbsp;
				<label><input name="companytype" type="checkbox" onclick="removeCompanyChecked(this)"  value="4"/><span class="rdContent">&nbsp;&nbsp;D.外</span> </label>
			</div>
			<div class="qa-hr"></div>
			<div style="line-height: 2"><strong>日期：</strong>
				<label><input name="establishdate" type="checkbox" onclick="removeEstabChecked(this)" value="1"/><span class="rdContent">&nbsp;&nbsp;A.3年</span> </label>&nbsp;&nbsp;
				<label><input name="establishdate" type="checkbox" onclick="removeEstabChecked(this)" value="2"/><span class="rdContent">&nbsp;&nbsp;B.5年</span> </label>&nbsp;&nbsp;
				<label><input name="establishdate" type="checkbox" onclick="removeEstabChecked(this)" value="3"/><span class="rdContent">&nbsp;&nbsp;C.10年</span> </label>&nbsp;&nbsp;
				<label><input name="establishdate" type="checkbox" onclick="removeEstabChecked(this)" value="4"/><span class="rdContent">&nbsp;&nbsp;10年以上</span> </label><br/><br/>
			</div>

JS：

<script>
		function removeCompanyChecked(obj){
				 var aa = $("input[name='companytype']:checked ");
				 for (var i = 0; i < aa.length; i++) {
				  aa[i].checked = false;
				 }
				 obj.checked = true;
		}
		function removeEstabChecked(obj){
				 var aa = $("input[name='establishdate']:checked ");
				 for (var i = 0; i < aa.length; i++) {
				  aa[i].checked = false;
				 }
				 obj.checked = true;
		}
		</script>

转载于:https://my.oschina.net/dyl226/blog/919018