文档建议反馈控制台
首页
学习
活动
专区
圈层
工具
MCP广场
文章/答案/技术大牛
发布
社区首页 >问答首页 >启用/禁用不在JQuery中工作的

问启用/禁用不在JQuery中工作的
EN

Stack Overflow用户
提问于 2018-01-16 23:34:41
回答 4查看 53关注 0票数 0

我有这个单选按钮。当选中no时，必须禁用下一个顶级单选按钮并取消选中(此操作有效)。当用户单击yes时，应启用下两个单选按钮并单击。问题在于，通过单击，yes，，按钮仍然是不可点击的。我做错了什么。我的代码如下。感谢你的帮助！

​

代码语言：javascript
复制
$(document).ready(function() {
	$(".blind-7").attr('disabled', true);
	$(".blind-8").attr('disabled', true);
	$(".nebel-3").css('opacity', '0.1');
	
	$("form input:radio").change(function() {
		if ($('#033b').is(':checked')) {
			$(".blind-7, .blind-8").attr('disabled', true);
			$(".blind-7").prop('checked', false);
			$(".blind-8").prop('checked', false);
			$(".nebel-3").css('opacity', '0.1');
		}
		else if ($('#033a').is(':checked')) {
			$(".blind-7, .blind-8").attr('disabled', false);
			$(".nebel-3").css('opacity', '1');
		}
	});
});
代码语言：javascript
复制
.nebel {
	color: black;
	background: #F9CA83;
}

.nebel-3 {
	color: black;
	background: #F9CA83;
}
代码语言：javascript
复制
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

    <label class="nebel" for="033">click here</label>
    <input id="033b" type="radio" name="question" value="0"checked> <label for="033b">no</label>
    <input id="033a" type="radio" name="question" value="1"> <label for="033a">yes</label>

    <label class="nebel-3" for="034">type</label>
    <input id="034b" class="blind-8" type="radio" name="type" value="0" > <label for="034b">A</label>
    <input id="034a" class="blind-7" type="radio" name="type" value="1"> <label for="034a">B</label><br />

    <label class="nebel-3" for="035">time</label>
    <input id="035b" class="blind-8" type="radio" name="time" value="0" > <label for="035b">acute</label>
    <input id="035a" class="blind-7" type="radio" name="time" value="1"> <label for="035a">chronic</label>

​

radio-button
javascript
jquery
html
css
EN

回答 4

Stack Overflow用户

回答已采纳

发布于 2018-01-16 23:45:37

选择器中没有父form。

将$("form input:radio")更改为$("input:radio")。

​

代码语言：javascript
复制
$(document).ready(function() {
	$(".blind-7").attr('disabled', true);
	$(".blind-8").attr('disabled', true);
	$(".nebel-3").css('opacity', '0.1');

	$("input:radio").change(function() {
		if ($('#033b').is(':checked'))
		{
			$(".blind-7, .blind-8").attr('disabled', true);
			$(".blind-7").prop('checked', false);
			$(".blind-8").prop('checked', false);
			$(".nebel-3").css('opacity', '0.1');
		}
		else if ($('#033a').is(':checked'))
		{
			$(".blind-7, .blind-8").attr('disabled', false);
			$(".nebel-3").css('opacity', '1');
		}
	});
});
代码语言：javascript
复制
.nebel {
	color: black;
	background:#F9CA83;
}

.nebel-3 {
	color: black;
	background:#F9CA83;
}
代码语言：javascript
复制
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<label class="nebel" for="033">click here</label>
<input id="033b" type="radio" name="question" value="0"checked> <label for="033b">no</label>
<input id="033a" type="radio" name="question" value="1"> <label for="033a">yes</label>


<label class="nebel-3" for="034">preop_ad_type_a</label>
<input id="034b" class="blind-8" type="radio" name="type" value="0" > <label for="034b">A</label>
<input id="034a" class="blind-7" type="radio" name="type" value="1"> <label for="034a">B</label><br />

<label class="nebel-3" for="035">preop_ad_type_b</label>
<input id="035b" class="blind-8" type="radio" name="time" value="0" > <label for="035b">acute</label>
<input id="035a" class="blind-7" type="radio" name="time" value="1"> <label for="035a">chronic</label>

​

票数 1
EN

Stack Overflow用户

发布于 2018-01-16 23:42:55

只需将这个$("form input:radio")修改为这个$("input:radio")，因为您没有表单标记。

​

代码语言：javascript
复制
$(document).ready(function() {
    $(".blind-7").attr('disabled', true);
    $(".blind-8").attr('disabled', true);
    $(".nebel-3").css('opacity', '0.1');

    $("input:radio").change(function() {
        if ($('#033b').is(':checked')) {
            $(".blind-7, .blind-8").attr('disabled', true);
            $(".blind-7").prop('checked', false);
            $(".blind-8").prop('checked', false);
            $(".nebel-3").css('opacity', '0.1');
        }
        else if ($('#033a').is(':checked')) {
            $(".blind-7, .blind-8").attr('disabled', false);
            $(".nebel-3").css('opacity', '1');
        }
    });
});
代码语言：javascript
复制
.nebel {
    color: black;
    background: #F9CA83;
}

.nebel-3 {
    color: black;
    background: #F9CA83;
}
代码语言：javascript
复制
<!DOCTYPE html>
<html>
<head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>DOM Example</title>
</head>
<body>
    <label class="nebel" for="033">click here</label>
    <input id="033b" type="radio" name="question" value="0"checked> <label for="033b">no</label>
    <input id="033a" type="radio" name="question" value="1"> <label for="033a">yes</label>

    <label class="nebel-3" for="034">preop_ad_type_a</label>
    <input id="034b" class="blind-8" type="radio" name="type" value="0" > <label for="034b">A</label>
    <input id="034a" class="blind-7" type="radio" name="type" value="1"> <label for="034a">B</label><br />

    <label class="nebel-3" for="035">preop_ad_type_b</label>
    <input id="035b" class="blind-8" type="radio" name="time" value="0" > <label for="035b">acute</label>
    <input id="035a" class="blind-7" type="radio" name="time" value="1"> <label for="035a">chronic</label>
</body>
</html>

​

票数 1
EN

Stack Overflow用户

发布于 2018-01-16 23:44:51

行$("form input:radio").change试图将更改侦听器附加到表单内部的类型无线电输入。

这不起作用，因为你的单选按钮周围没有<form>标签。如果您添加这样的<form>标记，它就会工作：

代码语言：javascript
复制
<form>
<label class="nebel" for="033">click here</label>
<input id="033b" type="radio" name="question" value="0"checked> <label for="033b">no</label>
<input id="033a" type="radio" name="question" value="1"> <label for="033a">yes</label>


<label class="nebel-3" for="034">preop_ad_type_a</label>
<input id="034b" class="blind-8" type="radio" name="type" value="0" > <label for="034b">A</label>
<input id="034a" class="blind-7" type="radio" name="type" value="1"> <label for="034a">B</label><br />

<label class="nebel-3" for="035">preop_ad_type_b</label>
<input id="035b" class="blind-8" type="radio" name="time" value="0" > <label for="035b">acute</label>
<input id="035a" class="blind-7" type="radio" name="time" value="1"> <label for="035a">chronic</label>
</form>`

或者，您可以更新要附加更改侦听器以读取：$("input:radio").change的行。

这两种方法都应该有效。

票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：

https://stackoverflow.com/questions/48291502

复制
相关文章

相似问题

领券

腾讯云开发者

扫码关注腾讯云开发者

扫码关注腾讯云开发者

领取腾讯云代金券

热门产品

热门推荐

更多推荐

Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有 

深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 粤公网安备44030502008569号

腾讯云计算（北京）有限责任公司 京ICP证150476号 |  京ICP备11018762号

问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档