重复的形式在一秒钟之后消失

时间:2015-12-08 10:37:07

标签: javascript html forms

每当我按“复制表单”按钮时,如何防止复制表单丢失?重复的表格出现约一秒然后立即消失,我该如何防止这种情况?

的Javascript

function myFunction() {
        var elmnt = document.getElementById("formid");
        var cln = elmnt.cloneNode(true);
        document.body.appendChild(cln);
}

HTML

<form action="dilemman.php" method="post" class="copy" id="formid" enctype="multipart/form-data">

    Video: <br>
    <textarea type="text" rows="1" cols="40" name="videolank"></textarea>

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
    <div class="input_fields_wrap">
        <button class="add_field_button">Lägg till fler svar</button>        
    </div>
     <button onclick="myFunction()">Duplicate form</button>
</form>

2 个答案:

答案 0 :(得分:0)

尝试将克隆按钮移到表单之外,我怀疑它会触发提交操作,因为该按钮是表单的一部分。

还要记住更改任何新表单的ID,因为重复的ID会破坏代码。我建议每次都添加一个计数器并将其添加到表单的ID中。

<form action="dilemman.php" method="post" class="copy" id="formid" enctype="multipart/form-data">

    Video: <br>
    <textarea type="text" rows="1" cols="40" name="videolank"></textarea>

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
    <div class="input_fields_wrap">
        <button class="add_field_button">Lägg till fler svar</button>        
    </div>

</form>
<button onclick="myFunction()">Duplicate form</button>    

var count = 0;
function myFunction() {
    var elmnt = document.getElementById("formid");
    var cln = elmnt.cloneNode(true);
    cln.id = "formid"+(++count); //add 1 to count, then append
    document.body.appendChild(cln);
}

答案 1 :(得分:0)

表单将默认提交,以禁用默认操作<button onclick="myFunction(e)">Duplicate form</button> function myFunction(e) { e.preventDefault(); ... rest of code }

MULTISET