我想使用一些 radio 输入创建一个表单。检查输入时，还会使用 jQuery 自动检查另一个 radio 。
例如:
问题1:A(勾选)，B，C question2: D(auto checked), E, F
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<tr>
<td>
<form name="form1" enctype="multipart/form-data">
<input type="radio" value="A" name="teamA" /> A<br />
<input type="radio" value="B" name="teamA" /> B<br />
<input type="radio" value="C" name="teamA" /> C<br />
<br /><br />
</td>
<td></td>
<input type="radio" value="D" name="teamB" /> D<br />
<input type="radio" value="E" name="teamB" /> E<br />
<input type="radio" value="F" name="teamB" /> F<br />
</form>
</td>
</tr>
</body>
</html>最佳答案
这是 jQuery 的有效使用，可以完成您要求的工作(w/jQuery)。我还清理了一些 html:
- 你缺少开始和结束标签
- 我把表单标签放在表外面(作为父表)，因为它以前在一个行单元格中开始并在另一个行单元格中结束 是非标准的html
- 在输入周围添加了标签 - 这是预期的用户界面/标准最佳实践，当有人点击“A”时，就好像他们点击了一样 单选按钮。
$(document).ready(function() {
//on any change in teamA
$("[name=teamA]").change(function() {
//get the index of clicked item (this) among set of teamA
//A is 0, B is 1, C is 2 within teamA,
//C is 0, D is 1, E is 2 within team B
//it's their order within the set
var clickedItemIndex=$(this).index("[name=teamA]");
$("[name=teamB]").eq(clickedItemIndex).prop("checked",true);
});
});
label { display: block } /* brs are a nuisance, display: block */<!DOCTYPE html>
<html>
<head>
<title></title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
</head>
<body>
<!--1. Another item you may have missed is that your code is missing <table> start and end blocks
2. I also took your form and put it OUTSIDE your table, it's not good form to start a form in one cell (a td block) and then end in another when you can just put the form as the parent to the table.
3. I added labels around inputs as that's standard best-practice, it means when somebody clicks the 'A' it's as if they clicked the radio, again - the expected standard UI of the web
-->
<form name="form1" enctype="multipart/form-data">
<table>
<tr>
<td>
<label><input type="radio" value="A" name="teamA" /> A</label>
<label><input type="radio" value="B" name="teamA" /> B</label>
<label><input type="radio" value="C" name="teamA" /> C</label>
</td>
<td>
<label><input type="radio" value="D" name="teamB" /> D</label>
<label><input type="radio" value="E" name="teamB" /> E</label>
<label><input type="radio" value="F" name="teamB" /> F</label>
</td>
</tr>
</table>
</form>
<script>
</script>
</body>
</html>关于jquery - 在检查另一个 radio 输入时更改一个 radio 输入，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/57246897/