Question

我有一个jinja2 html模板，该模板具有两组单选按钮，我们将其称为radio_group_1和radio_group_2。 radio_group_2中的每个按钮都映射到一个值上radio_group_1中的相应按钮。我想做的是，当用户在radio_group_2中选择一个单选按钮时，我希望radio_group_1中的单选按钮选择能够自动更改为其相应的单选按钮。

我尝试使用javascript无效。

感谢您的帮助！

<h2>Testing radio functionality</h2>
<div>
<input name="radio_group_1" id="1" value="button1" type="radio" onclick="radioChange('1','button1');" />Button 1
<input name="radio_group_1" id="2"value="button2" type="radio" onclick="radioChange('2','button2');" />Button 2
<input name="radio_group_1"id="3" value="button3" type="radio" onclick="radioChange('3','button3');" />Button 3
<br />
</div>

<div>
<input name="radio_group_2" id="4" value="button4" type="radio" onclick="radioChange('4','button1');" />Button 4
<input name="radio_group_2" id="5" value="button5" type="radio" onclick="radioChange('5','button1');" />Button 5
<input name="radio_group_2" id="6" value="button6" type="radio" onclick="radioChange('6','button1');" />Button 6
</div>

<script type="text/javascript">
function radioChange(id,radioButton,radioArray)
  {

  radiobtn = document.getElementById(id);
  radiobtn.checked = true;
  new_number = Number(id) + 3
  new_number.toString(10)
radiobtn = document.getElementById(new_number);
  radiobtn.checked = true;
}
</script>

Answer 1

代码的唯一问题是，您在方法调用 radioChange（'1'，'button1'）中传递了两个值，而您的方法原型由于这三个js接受了三个值无法找到接受两个参数的radioChange方法。只需从方法原型中删除 radioArray 即可。

<h2>Testing radio functionality</h2>
<div>
<input name="radio_group_1" id="1" value="button1" type="radio" onclick="radioChange('1','button1');" />Button 1
<input name="radio_group_1" id="2"value="button2" type="radio" onclick="radioChange('2','button2');" />Button 2
<input name="radio_group_1"id="3" value="button3" type="radio" onclick="radioChange('3','button3');" />Button 3
<br />
</div>

<div>
<input name="radio_group_2" id="4" value="button4" type="radio" onclick="radioChange('4','button1');" />Button 4
<input name="radio_group_2" id="5" value="button5" type="radio" onclick="radioChange('5','button1');" />Button 5
<input name="radio_group_2" id="6" value="button6" type="radio" onclick="radioChange('6','button1');" />Button 6
</div>

<script type="text/javascript">
function radioChange(id,radioButton)
  {

  radiobtn = document.getElementById(id);
  radiobtn.checked = true;
  new_number = Number(id) + 3
  new_number.toString(10)
radiobtn = document.getElementById(new_number);
  radiobtn.checked = true;
}
</script>

如何检查Jinja2 HTML模板中选中的单选按钮中的哪个单选按钮？

1 个答案: