1

我开始在 JS 中处理任务列表生成器的框架，并没有走得太远，我注意到通过表单提交任务后，整个页面都被重新加载，所以我无法在没有的情况下设置文本它立即消失。

我novalidate在 HTML 的表单中使用过，并且false在我的函数中返回了在表单提交时调用 get 的函数，所以我不确定问题出在哪里。我的代码附在这个 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;。由于我使用的是addEventListenerandattachEvent函数，因此处理此问题的正确方法（不修改标记）是将其添加到我的事件处理函数的末尾：

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

调用preventDefault方法或设置returnValueto false（for < IE9）可以有效防止表单提交。

于 2013-01-28T21:40:22.793 回答
0

防止输入按钮的默认操作。您可以通过 JQuery 的 preventDefault() 函数来做到这一点。或者只是<form onsubmit="return false;"> ... </form>

于 2013-01-28T19:47:36.660 回答