Question

我正在使用JQuery UI自动完成功能。我需要它到MustMatch所以我这样设置：

$('#MyAutoComplete').autocomplete({
    source: result,
    minLength: 1,
    change: function (event, ui) {
        if (!ui.item) {
            $('#MyAutoComplete').val('');
        }
    }
});

在填充字段并按预期工作时，不要担心结果。当有人键入不在列表中的值并单击该字段时，该字段将按照我的意愿删除 - 除非单击提交按钮。我的提交处理程序的简化版本是：

$('#MyButton').get(0).onclick = $('#MyForm').get(0).onsubmit = (function () {

    $('#MyForm').validate();
    var isValid = $('#MyForm').valid();

    if (!isValid) {
        return false;
    }
});

如果我直接从具有错误数据的聚焦AutoComplete单击“提交”按钮，则提交事件将在更改AutoComplete之前发生。所以糟糕的数据会被提交。任何其他操作都会清除导致提交失败的错误数据（因为该字段是必需的）。

任何想法如何解决这个问题？

我尝试将其中的每一项添加到提交事件的顶部。没有任何区别。

$('#MyAutoComeplete').data('autocomplete')._trigger('change');

$('#MyAutoComplete').blur();

$('#MyButton').focus();

组合框功能是否需要更高版本的脚本然后我使用？如果我接受这个：

$('#MyAutoComplete').autocomplete({
                    source: result,
                    minLength: 1,
                    change: function (event, ui) {
                        if (!ui.item) {
                            $('#MyAutoComplete').val('');
                        }
                    }
                });

把它变成这个：

$('#MyAutoComplete').combobox({
                    source: result,
                    minLength: 1,
                    change: function (event, ui) {
                        if (!ui.item) {
                            $('#MyAutoComplete').val('');
                        }
                    }
                });

我收到此错误：

JavaScript运行时错误：对象不支持属性或方法＆＃39; combobox＆＃39;

我正在使用：

jQuery UI 1.8.7

Answer 1

如果必须在列表中，则应使用组合框功能。基本语法是：

<select id="combobox">
<option value="">Select one...</option>
<option value="ActionScript">ActionScript</option>
<option value="AppleScript">AppleScript</option>
<option value="Asp">Asp</option>
<option value="BASIC">BASIC</option>
<option value="C">C</option>
<option value="C++">C++</option>
<option value="Clojure">Clojure</option>
<option value="COBOL">COBOL</option>
<option value="ColdFusion">ColdFusion</option>
<option value="Erlang">Erlang</option>
<option value="Fortran">Fortran</option>
<option value="Groovy">Groovy</option>
<option value="Haskell">Haskell</option>
<option value="Java">Java</option>
<option value="JavaScript">JavaScript</option>
<option value="Lisp">Lisp</option>
<option value="Perl">Perl</option>
<option value="PHP">PHP</option>
<option value="Python">Python</option>
<option value="Ruby">Ruby</option>
<option value="Scala">Scala</option>
</select>

<script>
    $(function() {
      $( "#combobox" ).combobox();
    });
</script>

您可以在http://jqueryui.com/autocomplete/#combobox

了解有关如何使用它的更多信息

单击按钮后自动完成更改事件触发

1 个答案: