1

JSでタスクリストメーカーのスケルトンに取り組み始めましたが、フォームからタスクを送信するとページ全体がリロードされることに気付くまで、それほど遠くはありませんでした。すぐに消えます。

私はnovalidateHTMLのフォームで使用しましたが、フォームの送信時に呼び出される関数に戻ってきfalseたので、問題が何であるかわかりません。私のコードはこのCodePenに添付されています：http：//cdpn.io/JArfm

いくつかの関連コード：

HTML：

<body>
    <form action="#" method="post" id="theForm" novalidate="">
        <fieldset><legend>To-dolist</legend>
            <p>Add things to-do on your list</p>
            <div class="addTasks"><label for="addTask">Event name:</label><input type="text" name="addTask" id="addTask" value="addTask"></div>
            <div><input type="submit" value="Add task!" id="submit"></div>
            <div id="output"></div>
        </fieldset>
    </form>
</body>

JS：

(function(){

    function addTask(e){
    'use strict';

    if (typeof e == 'undefined') e = window.event;

    var task = U.$('addTask').value;

    U.setText('output', task);
    return false;
    }


    window.onload = function(){
        "use strict";

        U.addEvent(U.$('theForm'), "submit", addTask);
    };
})();
4

2 に答える 2

1

イベント ハンドラ関数で false を返すと、従来のイベント登録モデルを使用している場合にのみ、フォームの送信が正しく停止されるようです ( element.onsubmit = doThis;)。addEventListener関数と関数を使用していたのでattachEvent、この問題を (マークアップを変更せずに) 処理する正しい方法は、これをイベント ハンドラー関数の最後に追加することです。

if (e.preventDefault) {
    e.preventDefault();
} else {
    e.returnValue = false;
}
return false;

メソッドの呼び出しpreventDefaultまたはreturnValuetoの設定false(IE9 未満の場合) は、フォームの送信を防止するのに効果的です。

于 2013-01-28T21:40:22.793 に答える
0

入力ボタンのデフォルトのアクションを防ぎます。これは、JQuery の preventDefault() 関数で行うことができます。または、単に<form onsubmit="return false;"> ... </form>

于 2013-01-28T19:47:36.660 に答える