Javascript 每次按下按钮时添加一个新的文本字段_Javascript_Html

Javascript 每次按下按钮时添加一个新的文本字段

javascript html

Javascript 每次按下按钮时添加一个新的文本字段,javascript,html,Javascript,Html,我正在尝试创建一个javascript，它会在每次按下按钮时创建一个新的文本字段，任何帮助都将不胜感激，看起来javascript不想运行多次 <!DOCTYPE html> <html> <head> <title>Q&A Admin Panel</title> </head> <body> <h1>Q&A Admin Panel</h1

我正在尝试创建一个javascript，它会在每次按下按钮时创建一个新的文本字段，任何帮助都将不胜感激，看起来javascript不想运行多次

<!DOCTYPE html>
<html>
    <head>
        <title>Q&A Admin Panel</title>
    </head>
<body>
    <h1>Q&A Admin Panel</h1>
    <form action="add_question.php" method="post">
    Question Type: <input type="text" id="questionType" />
    Question Name: <input type="text" id="questionName" />
    Question Text: <input type="text" id="questionText" />
    <select id="myList" onchange="selectType()">
    <option>Yes or No</option>
    <option>Multiple Choice</option>  
    <option>Multiple Select</option>
    <option>Open Response</option>
    </select>
    <div id='buttons'> </div>
    </form>
    <script type="text/javascript">
    function selectType()
    {
    var type=document.getElementById("myList");
    if(type == "Multiple Choice" or type == "Multiple Select"){
    // add answer = visible
        }
    }
    </script>

    <script type="text/javascript">
    var answers = 0;
    function addAnswer()
    {
    write = document.getElementById('buttons');
    write.innerHTML = write.innerHMTL + "add answer: <input type=\"text\" id=\"answer" + answers + "\" <br>";
    answers = answers + 1;
    }
    </script>
    <button onclick="addAnswer(); return false;">add answer</button>
</body>
</html>


问答管理面板
问答管理面板
问题类型：
问题名称:
问题案文：
是还是不是
选择题
多选
开放式响应
函数selectType（）
{
var type=document.getElementById（“myList”）；
如果（类型=“多选”或类型=“多选”）{
//添加答案=可见
}
}
var=0；
函数addAnswer（）
{
write=document.getElementById（'buttons'）；
write.innerHTML=write.innerHMTL+“添加答案：var answers=0，
write=document.getElementById（'buttons'）；
函数addAnswer（）{
write.innerHTML+=“添加答案：
”；
答案++；
}
var answers=0，
write=document.getElementById（'buttons'）；
函数addAnswer（）{
write.innerHTML+=“添加答案：
”；
答案++；
}
在我的大学项目中，我遇到了同样的问题。你也可以按照David的建议完成你的工作，但是使用innerHTML不会向DOM添加元素，因此，当你刷新页面时，文本字段将消失。因此，要获得持久文本字段，你可以使用下面提到的代码：
var i = 0;

function addMore()
{
   var x = document.getElementById('buttons');
   var input1 = document.createElement("input");
   input1.setAttribute("type","text");
   input1.setAttribute("name","i" + i );
   x.appendChild( input1 );
   i++;
}  

您可以使用firebug调试javascript。
谢谢。
在我的大学项目中，我遇到了同样的问题。你也可以按照David的建议完成你的工作，但是使用innerHTML不会向DOM添加元素，因此，当你刷新页面时，文本字段将消失。因此，要获得持久文本字段，你可以使用下面提到的代码：
var i = 0;

function addMore()
{
   var x = document.getElementById('buttons');
   var input1 = document.createElement("input");
   input1.setAttribute("type","text");
   input1.setAttribute("name","i" + i );
   x.appendChild( input1 );
   i++;
}  

您可以使用firebug调试javascript。
谢谢。
函数addTextField（id）{
var colors=新数组（“#660000”、“#33ff00”、“#0066ff”、“#cc3399”、“#9966ff”）；
var container=document.getElementById（id）；
var-uleElement=document.createElement（'ul'）；
容器。附属物子元素（ulElement）；
var hideLink=函数（）{
var firstElement=ulement.firstChild.getElementsByTagName（'a'）[0]；
firstElement.style.display=（uleElement.childNodes.length==1）？“无”：“内联”；
对于（变量i=0；i函数addTextField（id）{
var colors=新数组（“#660000”、“#33ff00”、“#0066ff”、“#cc3399”、“#9966ff”）；
var container=document.getElementById（id）；
var-uleElement=document.createElement（'ul'）；
容器。附属物子元素（ulElement）；
var hideLink=函数（）{
var firstElement=ulement.firstChild.getElementsByTagName（'a'）[0]；
firstElement.style.display=（uleElement.childNodes.length==1）？“无”：“内联”；
对于（var i=0；我有想过在php中试用它吗？如果您同意的话，我可以告诉您如何在php中使用它。@redelman431我认为服务器端解决方案根本就不等效。好的，我将继续讨论另一个问题。您拼写错了“innerHTML”：-）另外，声明“write”“在使用var
的函数中！您想过在php中尝试吗？如果您同意，我可以告诉您如何在php中实现它。@redelman431我认为服务器端解决方案根本不等效。好的，我将继续问另一个问题。您拼错了“innerHTML”：-）另外，声明“write”在该函数中使用var！
function addTextField(id){
    var colors = new Array('#660000','#33ff00','#0066ff','#cc3399','#9966ff');
    var container = document.getElementById(id);
    var ulElement = document.createElement('ul');
    container.appendChild(ulElement);
    var hideLink = function(){
        var firstElement = ulElement.firstChild.getElementsByTagName('a')[0];
            firstElement.style.display = (ulElement.childNodes.length==1)?'none':'inline';
        for(var i = 0 ; i <ulElement.childNodes.length; i++)
            ulElement.childNodes[i].style.color = colors[i%5];
    }
    var addListElement = function(){
        var liElement = document.createElement('li');
        ulElement.appendChild(liElement);
        var textElement = document.createElement('input');
        textElement.setAttribute('type','text');
        liElement.appendChild(textElement);

        var deleteLink = document.createElement('a');
        deleteLink.href = "#";
        deleteLink.appendChild(document.createTextNode('delete'));
        liElement.appendChild(deleteLink);
        deleteLink.onclick = function(){
            ulElement.removeChild(liElement);
            hideLink();
        }
        hideLink();
    }
    addListElement();
    var anchorElement = document.createElement('a');
    anchorElement.href = "#";
    anchorElement.appendChild(document.createTextNode('Add more'));
    container.appendChild(anchorElement);
    anchorElement.onclick = addListElement;
    hideLink();

}