通过选择显示下一个字段集

show next fieldset by making a choice

本文关键字：字段 下一个 显示 选择      更新时间：2023-09-26

一个快速的问题，对于我的前端开发类，我必须制作一个包含多个字段集的表单。我做到了，还可以，但现在的下一个任务是通过选择来显示下一个字段集。

我很高兴：Voor een项目

            <input id="Stage" type="radio"/>
            <label for="Stage">Als stagebedrijf</label>

在上面，你会发现我的代码必须发生的地方。用户需要选择"voor een project"或"als stagebedrijf"。我知道我必须用javascript做这件事，所以我已经做了一个文件。它不能在HTML文件中使用onClick。

所以我的问题是，我该如何做这样的事情？

非常感谢！

您可以使用'addEventListener'方法添加事件处理程序。

这是一把小提琴：

http://jsfiddle. net/bj0mba74/1/

（你必须删除链接中的空格。

HTML:

<form>
     <input id="radio_1" name="my_radio" type="radio"/>
     <label for="radio_1">Radio 1</label>
     <input id="radio_2" name="my_radio" type="radio"/>
     <label for="radio_2">Radio 2</label>
  <fieldset>
      <input type="text" value="Fieldset 1" />
  </fieldset>
  <fieldset>
      <input type="text" value="Fieldset 2" />
  </fieldset>
</form>

JS:

function enableFieldset1 () {
    /* Code to enable fieldset 1 goes here. */
    alert('Enable fieldset 1');
}
function enableFieldset2 () {
    /* Code to enable fieldset 2 goes here. */
    alert('Enable fieldset 2');
}
document.getElementById('radio_1').addEventListener('click', enableFieldset1);
document.getElementById('radio_2').addEventListener('click', enableFieldset2);
相关文章：