Question

我正在尝试让我的用户生成一个表单，用于通过JavaScript和w3c dom自动添加团队成员。但它没有用。

这是我的JavaScript函数以及html页面和我想要生成的表单：

＆＃13;

var counter = 0;

function member_card()
{
    counter++;
    var newFields = document.getElementById('teamform').cloneNode(true);
    newFields.id = '';
    newFields.style.display = 'block';
    var newField = newFields.childNodes;
    for (var i=0;i<newField.length;i++) {
        var theName = newField[i].name
		if (theName)
			newField[i].name = theName + counter;
    }
    var insertHere = document.getElementById('addform');
	insertHere.parentNode.insertBefore(newFields,insertHere);
}

window.onload = member_card;

＆＃13;

<section class="container" xmlns="http://www.w3.org/1999/html">
        <div class="row addform">
            <div class="col-md-6 addform-col">

                <div class="row input-field">
                    <div class="col-md-4">
                        <label class="add-lable">Team Member<spna style="color:red">*</spna></label>
                    </div>

                        <div name="teamform" class="col-md-6" style="display: none">
                            <form>
                            <div name="imageholder" class="row tm-image-holder">
                                <div class="col-md-12"><div style="background-image: url(../img/DSC_3305.jpg);" class="tm-img"></div></div>
                            </div>
                            <a name="photo" href="#" class="btn btn-block btn-lg btn-primary inout-margin mybut"><span class="glyphicon glyphicon-search"></span> Browse Photo</a>
                            <input name="name" type="text" class="add-input input-margin" placeholder="Name, Mohammad, ... *">
                            <input name="job" type="text" class="add-input" placeholder="Job, Developer, Designer, ... *">
                            <textarea name="explain" class="add-textarea input-margin" rows="4" placeholder="Explain this member in 2 to 4 lines *"></textarea>
                            </form>
                        </div>

                    <form method="post" action="">
                        <input type="button" id="member_card" value="Give me more fields!" />
                    </form>

                </div>
            </div>
        </div>
    </section>

＆＃13;

Answer 1

没有id =＆＃34; teamform＆＃34;的元素。你需要改变 name="teamform"到id="teamform" 在你的HTML中。

要查看此类问题，通常最简单的方法是尝试在Chrome或其他具有开发人员工具的浏览器中运行代码，并打开调试器控制台以查看代码失败的方式。

使用带有onclick按钮的javascript生成新表单

1 个答案: