jQuery自动完成:点击返回提交表单

时间:2011-02-03 00:02:39

标签: javascript jquery jquery-autocomplete

我正在使用jQuery Autocomplete插件。

// 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代码是否可能会干扰?

2 个答案:

答案 0 :(得分:1)

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

答案 1 :(得分:0)

您需要通过连接form.submit的事件处理程序来禁用enter上的提交:$(“form”)。submit(function(){   返回false; });