jQuery自动完成：点击返回提交表单答案

【问题标题】：jQuery Autocomplete: Hitting return submits the formjQuery自动完成：点击返回提交表单
【发布时间】：2011-02-03 00:02:38
【问题描述】：

我正在使用 jQuery 自动完成插件。

// I'm not sure if there's a better way to do this

var base_url = window.location.href.slice(0, window.location.href.indexOf('/bar'));
$('.foo-widget').find('input:first-child').autocomplete(base_url + "/api/baz?format=newline");

标记：

<ul class="foo-widget">
    <li>
        <input value="" autocomplete="off" class="ac_input"><input value="" autocomplete="off" class="ac_input"><button>Add</button>
   </li>
</ul>

这很好用。但是，当我点击“输入”从自动完成结果中选择一个项目时，表单就会提交。为什么会发生这种情况？

我查看了 jquery.autocomplete.js 并看到正在执行以下内容：

        case KEY.RETURN:
            if( selectCurrent() ) {
                // stop default to prevent a form submit, Opera needs special handling
                event.preventDefault();
                blockSubmit = true;
                return false;
            }
            break;

event.preventDefault() 和blockSubmit = true 不应该阻止表单提交吗？我在页面其他地方的 JS 代码是否可能会干扰？

【问题讨论】：

在到达 preventDefault() 代码之前，您可能会遇到另一个 javascript 错误。 Firebug 是否显示任何错误？
返回 false 阻止提交。
你在那个页面有多少表格？
@aSeptik 只有一种形式。 @Jared Farrish Firebug 没有显示任何错误。
Rosarch，如果您找到解决方案，请发布 sn-p。

标签： javascript jquery jquery-autocomplete

【解决方案1】：

我建议在 Autocomplete 元素上添加一个按键事件并从中返回 false。它不会影响您以后提交表单其余部分的能力。

【讨论】：

【解决方案2】：

您将希望通过为 form.submit 连接事件处理程序来禁用输入时提交： $("form").submit(function() { 返回假； });

【讨论】：

但我不想总是禁用表单提交 - 我只希望在用户在自动完成结果上点击“返回”时禁用它。