Question

我正在使用自动填充小部件，并希望在选择项目时显示一个对话框。该对话框确实显示，但我希望对话框中的一个字段在打开时获得焦点。这是我到目前为止所尝试的：

// HTML

<form action="#">
  <p><input id="busca" /></p>
</form>
<div id="agregar" title="Agregar Parte">
  <label for="cantidad">Cantidad:</label>
  <input name="cantidad" id="cantidad" size="3" />
</div>

// jquery的

 $(function(){

        $("#agregar").dialog({
                        autoOpen: false,
                        //also tried open: function(){$("#cantidad").focus()}
                        }
              );      
        //.bind("dialogfocus", ... ) does not work either
        $("#agregar").bind("focus", function(){
                   $("#cantidad").focus(); });

    $("#busca").autocomplete({
            source: "/carrito/autocomplete/",
            minLength: 1,
                        select: function(e, ui) {
                          $("#agregar").dialog("open");
                        }
        });


      });

我认为自动选择的默认行为仍在做某事，因为自动选择小部件在显示对话框后获得焦点。

非常感谢任何帮助。

Answer 1

尝试此操作以覆盖自动填充的行为：

$("#agregar").dialog({
  autoOpen: false,
  open: function(){
      setTimeout(function() { $("#cantidad").focus(); }, 0);
  }
});

这会将.focus()排队，以便在选择代码运行后运行。这就是自动完成正在做的事情（straight from the source code, line 604）：调用你的select（和那个打开的函数）然后窃取焦点：

select();
// TODO provide option to avoid setting focus again after selection? 
// useful for cleanup-on-focus
input.focus();

选择jquery ui 1.7自动完成显示对话框

1 个答案: