jQuery UI自动完成组合框-阻止表单提交

问题描述

我正在使用jQuery UI Autocomplete的漂亮的'combobox'变体-参见此处: http: //jqueryui.com/demos/autocomplete/#combobox

I'm using the nifty 'combobox' variant of jQuery UI Autocomplete - see here: http://jqueryui.com/demos/autocomplete/#combobox

我将其包含在Form元素中，因为它是表单的一部分.

I have it within a Form element because its part of a form.

自动完成组合框"具有<button>，用于显示整个下拉列表.但是，当用户按下它时，表单将提交.这似乎是因为<button>具有type="submit"属性.整个元素由.combobox fn中的button()调用创建，请参见s 源代码.

The Autocomplete Combobox has a <button> that is used to show the whole drop down list. However when the user presses it, the form submits. This appears to be because the <button> has a type="submit" attribute. The whole element is created by the button() call within the .combobox fn, see source code.

如何停止提交?

(NB:这个家伙也遇到了同样的问题但他通过删除form修复了它-我无法做到)

(NB: This guy had the same problem but he fixed it by removing the form - I can't do that)

推荐答案

啊，没关系，我知道了.

Ah, nevermind, I figured it out.

此问题在jQuery论坛上进行了讨论: http://forum .jquery.com/topic/autocomplete-combobox-problem-何时将其放置在一个表单标签中

The problem is discussed on the jQuery forum here:http://forum.jquery.com/topic/autocomplete-combobox-problem-when-it-is-placed-inside-a-form-tag

他们提出了几种不同的方法来调整自动完成组合的源代码以进行修复.最简单的一个似乎是这样的:

They suggest several different ways of adjusting the source code of the autocomplete combo to fix it. The simplest one seems to be this:

更改显示的行

$("<button>&nbsp;</button>")

到

$("<button type=\"button\">&nbsp;</button>")

这可以防止将type="submit"插入到最终按钮中.

this prevents the type="submit" from being inserted into the final button.

这篇关于jQuery UI自动完成组合框-阻止表单提交的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！