我有2个无线电按钮和禁用的浏览按钮,我只想在选中单选按钮时启用浏览按钮。
这是我在做的。
请在下面找到HTML,让我知道我要在哪里出错,或者我可以提出代码。
<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
<script>
< script type = "text/javascript" >
$("input.[name=radio2]").change(function() {
$('input.[name=upload]').prop("disabled", false);
});
</script>
</head>
<body>
<form>
<p>
<h5><label><b>Choose option:</b></label></h5>
<label class="radio radio--alt">
<input type="radio" name="radio2">
<span class="radio__input"></span>
<span class="radio__label">XYZ</span>
</label>
<label class="radio radio--alt">
<input type="radio" name="radio2">
<span class="radio__input"></span>
<span class="radio__label">ABC</span>
</label>
<br><b>
<h4>Upload File:   <input type="file" id="uploadFile" name="upload" disabled="disabled"> </h4>
</p>
</form>
</body>
</html>
您使用的是属性选择器来选择正确的元素,但您在其上有额外的 .
。
尝试这个
$("input[name='radio2']").change(function () {
$('input[name="upload"]').prop("disabled", false);
});
或最简单的(类和ID选择器)
$(".radio-someclass").change(function () {
$('#uploadFile').prop("disabled", false);
});
为此,请确保将radio-someclass
添加到两个无线电元素中。
更新
好的,等等。因此,您还没有使用jQuery,您还有额外的<script>
,然后将脚本放入Document..ready。该死!!!很多事情让我粘贴整个过程。请正确浏览它,看看您错过了什么。:)
<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js">
</script>
<script>
$(function(){
$("input[name='radio2']").change(function() {
$('input[name="upload"]').prop("disabled", false);
});
})
</script>
</head>
<body>
<form>
<p>
<h5><label><b>Choose option:</b></label></h5>
<label class="radio radio--alt">
<input type="radio" name="radio2">
<span class="radio__input"></span>
<span class="radio__label">XYZ</span>
</label>
<label class="radio radio--alt">
<input type="radio" name="radio2">
<span class="radio__input"></span>
<span class="radio__label">ABC</span>
</label>
<br><b>
<h4>Upload File:   <input type="file" id="uploadFile" name="upload" disabled="disabled"> </h4>
</p>
</form>
</body>
</html>