javascript - 无法动态生成文本字段Javascript onChange

Question

我在动态生成文本字段时遇到问题。我在表单中有一个选择框，我想做的是根据下拉列表中选择的数字创建文本字段。因此，如果用户选择一个，我想在其下方创建一个文本字段。我正在使用 javascript 和 onChange 事件来完成它。但是代码在任何浏览器中都不起作用。

这是我在文档的 head 部分使用的 javascript 函数:

function addField() 
 {
 alert("Hello");
 var num=document.forms["myForm"]["timePerDay"].value;
   for(var i=0;i<num;i++)
    {
    var element = document.createElement("input");


    element.setAttribute("type", input);
    element.setAttribute("name", time[] );

    var foo = document.getElementById("fooBar");

    //Append the element in page (in span).
    foo.appendChild(element);
    }
    }

选择字段是:

 <select name="timePerDay" onChange="javascript:addField();"> 
<option selected="selected">Select One</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>

<span id="fooBar">
</span>

似乎 onChange 在任何浏览器中都没有触发，因为我试图将警告消息放入 JS 函数中，甚至它也不起作用。那么你能告诉我问题是什么吗？ 您可以在以下位置查看该页面:http://motushealth.com/form1.html

附言: 我在表单上使用另一个 JS 函数来验证它，它适用于 Onsubmit 。它运行良好。

Answer 1

这里的问题是语法错误:element.setAttribute("name", time[] ); time[]在php中有效，在js中无效.

编辑:

替代方法是不使用内联 js (...onClick='javascript:addField();'...)。而是在 window.onload 或更好的 onDomReady 事件上执行以下操作。

JS:

window.onload = function() {  /* or window.addEventListener */
    document.getElementById('timePerDay').onchange = addField;  /* or addEventListener */
};

标记可以是:

<select id="timePerDay" name="timePerDay"> 
    <option selected="selected">Select One</option>
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
</select>