mootools 中 keyup 上的停止事件在输入键上不起作用答案

【问题标题】：stop event on keyup in mootools doesn't work on enter keymootools 中 keyup 上的停止事件在输入键上不起作用
【发布时间】：2012-02-18 12:23:09
【问题描述】：

我有这个表格：

            <div class="row border-tb">
                <form id="test-form" action="/test/insert" method="post" class="form-inline offset4 span16">
                    <div class="box-suggest span13 border-tb">
                        <input type="text" name="test" value="" id="test" class="span13" placeholder="proviamo con il test"/>
                    </div>
                    <button style="margin-left: 5px;" id="send-button" type="submit" class="btn"> <i class="icon-plus"></i> </button>
                </form>
            </div>

还有这个用于捕获 keyup 的 mootools 事件：

            $('test').addEvent("keyup",function(event){
                event.stop();
                alert("Why after this alert redirect on url: test/insert ??????");
            })

我的问题是当我按下 ENTER 键时 event.stop() 不会阻止表单提交。

我也尝试过 event.stopPropagation() 和 event.preventDefault() 但没有。当我按 ENTER 键时，它总是重定向到 url: "test/insert"。

为什么？

【问题讨论】：

标签： mootools onkeyup

【解决方案1】：

这是因为在 keydown 上也触发了事件，然后在表单上触发了提交事件。

尝试添加这个：

$('test-form').addEvent("submit",function(event){
   event.stop();
   return false;
});

===================

编辑

以上将阻止所有表单提交，因为这可能不是您想要的，这里有一个更好更简单的解决方案：

$('test').addEvent("keydown",function(event){
    event.stop();
    alert("Why after this alert redirect on url: test/insert ??????");
    return false;
})

我之前没有写过它，因为您实际上可能需要按键 UP 事件而不是 DOWN，但这更有意义。

【讨论】：