我有选择一组单选按钮的代码。现在,javascript通过按ID获取元素来选择单选按钮。我想看看是否有一种方法可以使用类名而不是ID来实现这一点?这里的任何帮助都将不胜感激。你可以在上面的例子中看到我的代码是如何运行的,我只是更喜欢使用类名而不是ID。
?
<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.0/css/bootstrap.min.css" rel="stylesheet"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<button onclick="check()">Select All Option 1</button>
<button onclick="uncheck()">Un-Select Option 1</button>
<table class="table table-striped">
<thead>
<tr>
<th scope="col">Count</th>
<th scope="col">Type 1</th>
<th scope="col">Type 2</th>
</tr>
</thead>
<tbody>
<tr>
<th scope="row">0</th>
<td>
<!-- Group of default radios - option 1 -->
<div class="custom-control custom-radio">
<input type="radio" class="custom-control-input allOption1" id="option1Id1" name="group1">
<label class="custom-control-label" for="option1Id1">Option 1</label>
</div>
</td>
<td>
<!-- Group of default radios - option 2 -->
<div class="custom-control custom-radio">
<input type="radio" class="custom-control-input" id="option1Id2" name="group1" >
<label class="custom-control-label" for="option1Id2">Option 2</label>
</div>
</td>
</tr>
<tr>
<th scope="row">1</th>
<td>
<!-- Group of default radios - option 1 -->
<div class="custom-control custom-radio">
<input type="radio" class="custom-control-input allOption1" id="option2Id1" name="group2">
<label class="custom-control-label" for="option2Id1">Option 1</label>
</div>
</td>
<td>
<!-- Group of default radios - option 2 -->
<div class="custom-control custom-radio">
<input type="radio" class="custom-control-input" id="option2Id2" name="group2" >
<label class="custom-control-label" for="option2Id2">Option 2</label>
</div>
</td>
</tr>
</tbody>
</table>
<script>
function check() {
document.getElementById("option1Id1").checked = true;
document.getElementById("option2Id1").checked = true;
/* document.getElementsByClassName('allOption1').checked = true; */
}
function uncheck() {
document.getElementById("option1Id1").checked = false;
document.getElementById("option2Id1").checked = true;
}
</script>
?
转载请注明出处:http://www.hnsdbxf.com/article/20230526/2148274.html