1

javascriptで動的要素が挿入されるフォームがあり、奇妙な動作が発生しています。ボタンをクリックしてフォームのテーブルに別の要素を追加すると、要素が追加されますが、すぐにフォームの投稿に表示されます（まだフォームを送信するつもりはありません）

同じ動作をするページの簡略化された例を作成しました。最初のテーブル要素はページの読み込み時に作成され、ボタンをクリックすると後続の要素が追加されます。このフォームはIEで正常に機能します。誰かがこの行動を防ぐ方法のアイデアを持っていますか？

これがコードサンプルです。

<!DOCTYPE html>
<html>
<head>
    <title>Test Creating Form</title>
    <meta http-equiv="Content-type" content="text/html;charset=UTF-8">
    <style type="text/css">
        td{font-family:verdana;}
    </style>
    <script type="text/javascript">
        var counter = 0;

        function makeTitle(title){
            if(counter){
                title += " " + counter;
            }
            counter++;
            var tbl = document.getElementById('tbl');
            var tr = tbl.insertRow(-1)
            var td1 = tr.insertCell(-1);
            td1.innerHTML = title;
        }


        function load1(){
            makeTitle('Primary Specimen');
        }
    </script>
</head>
<body onload="load1();">
    <form action="formtest.htm" method="post" name="testForm" id="testForm">
        <table id="tbl" border="1"></table>
        <button onclick="makeTitle('Alternate Specimen')" id="clone" >Add Another Specimen</button>


    </form>
</body>
</html>
4

2 に答える 2

2

ボタンタグのデフォルトはtype="submit";です。追加しtype="button"ます。

于 2012-11-28T23:02:18.537 に答える
0

でクリックイベントをキャンセルするreturn false;か、を追加しtype="button"ます。<button />-属性のないAtypeは、デフォルトではsubmit-ボタンです。

<button type="button" onclick="makeTitle('Alternate Specimen')" id="clone" >Add Another Specimen</button>
于 2012-11-28T23:03:03.097 に答える