Question

我有一个绑定到jQuery UI自动完成的文本框。当用户从自动完成下拉列表中选择一个选项时，JSON数据用于填充包含来自远程源的用户详细信息的表单。

我有一个重置按钮，其中包含以下功能：

$('#btn_reset').on('click', function() {
    $('#txt_name').autocomplete('search');
    $('.ui-menu-item').children().eq(0).click();
    return false;
});

这适用于少量本地数据，search在调用click()之前完成，但是如果有大量外部数据，则search无法及时完成，因此给我一个'item' is null or not an object错误。

如何在调用search之前让jQuery等到click()完成？

以下是使用本地数据源的工作小提琴：http://jsfiddle.net/3KTtT/3/

Answer 1

解决方法是将函数绑定到自动完成的open事件，以检查布尔变量以确定是否正在重置表单。

var reset = false;
$(function() {    
    $('#txt_name').autocomplete({
        source: [{"label":"john smith","address":"19 Tree Lane"}],
        delay: 0,
        autoFocus: true,
        open: function() {
            if(reset){
                $('.ui-menu-item').children().eq(0).click();
                reset = false;
            }
        },
        select: function(event, ui) {
            $('#txt_address').val(ui.item.address);
        }

    });

    $('#btn_reset').on('click', function() {
        reset = true;
        $('#txt_name').autocomplete('search');
        return false;
    });

});

请看这里的小提琴：http://jsfiddle.net/RVnkz/2/

Answer 2

我已经改变了你的例子，包括一个延迟循环，它检查是否有值，然后我调用你的点击事件。应该让你走在正确的轨道上：

jsFiddle Demo

如果你看下面的代码，我得到的大于0只是为了你可以测试代码，但它应该小于1.

  $('#btn_reset').on('click', function() {
    $('#txt_name').autocomplete('search');
    if($('#txt_name').val().length>0) //THIS LINE
    {
      CheckValue();
   } 
    else
    {                      
    $('.ui-menu-item').children().eq(0).click();
    return false;
    }
});

jQuery UI自动完成等待搜索事件完成

2 个答案: