首页 > 解决方案 > HTML 和 JavaScript 中的表单

问题描述

表单中已经存在三个单选按钮选项,单击按钮会创建一个单选按钮选项,再次单击它会创建一个具有相同名称的新选项。(i)如何阻止它使用 Javascript 一遍又一遍地表现出类似的行为?(ii) 如果不停止创造,我们如何给新的期权连续编号作为价值?

function addOption() {
  var a = document.getElementById('form');
  var x = '<input type="radio" name="poll-option" value="option4" /><label for="option4">';
  var z = '</label><br />';
  var y = 'option' + 4;
  var option = x + y + z;
  a.innerHTML = a.innerHTML + option;
}

我们需要更改选项对应的输入标签中的'value'属性和标签标签中的'for'属性。例如,如果我单击按钮,我会得到新选项 - 选项 4 及其属性值 =“option4”和 for =“option4”。然后它将是下一次单击的选项 5。

标签: javascripthtmlnode.jsformspolling

解决方案


试试下面的代码

var i = 0; //add this global variable, it will be incremented each time it is clicked
function addOption() { 
        var a=document.getElementById('myForm');       
        var x = '<input type="radio" name="poll-option" value="+i+" /><label for="option4">';
        var z = "</label><br />";
        var y= "option" + i++;
        var option =  x + y + z;
        a.innerHTML += option;
        console.log(a);
    }
<form id="myForm"></form>
<button onClick="addOption();">click me</button>
这行得通。

希望这可以帮助


推荐阅读