Javascript动态添加带有值的文本框

标签 javascript ajax

我是 JavaScript 的新手。我想在运行时动态添加多个文本框..

        <script type="text/javascript">
            function ajax(){
                var x = document.getElementById("ajax").innerHTML;
                x= x + '<input name="reference[]" type="text" />';
                document.getElementById("ajax").innerHTML = x;
            }
        </script>

这是一个点击事件。我的问题是,每次添加新文本框时,我以前的文本框的值都会消失,并且每次调用该函数时所有文本框都是空的。

最佳答案

我建议使用 document.createElementdocument.appendChild

Example

function ajax() {
    var textBox = document.createElement('input');
    textBox.name = 'reference[]';
    textBox.type = 'text';
    document.getElementById("ajax").appendChild(textBox);
}

关于Javascript动态添加带有值的文本框,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/7724338/

相关文章:

javascript - float div - 向现有脚本添加多个

javascript - 如何使用 jquery 在页面加载时触发 Click

php - JSON 到 HTML 表

ruby-on-rails - 从ajax响应中获取参数Rails

带有 div 的 Javascript/HTML Oninput

javascript - 是否可以将值从数组添加到对象属性?

asp.net - 使用 ASP.NET 添加像 facebook 这样的评论

javascript - Ajax 调用未从 Controller 返回成功

javascript - 有没有办法对 AJAX 表单执行类似于 onbeforeunload 的操作?

javascript - JavaScript、Php、AJAX、MySql 网站上的“赞成”按钮无法正常工作。我究竟做错了什么?