由jQuery$.get(..)加载的Focus元素

Focus element loaded by jQuery $.get(...)

本文关键字:加载 Focus 元素 jQuery get      更新时间:2023-09-26

我正在加载一个html片段,将其插入某个元素之后,并希望使用类.focus集中输入字段。此类可能有多个元素。与load(...)类似的代码也能工作。

  var item = $(this).closest(".something");
  $.get(
    url, 
    function(data) { 
      item.after(data);
      $(data).find(".focus").focus(); /* everything works except this line */
    }
  );

加载的html:的相关部分

<input type="text" class="focus" value="" name="email"/>

看起来要聚焦的元素是(在调试器中)找到的,但它没有得到焦点。知道怎么了吗?

item.after(data)data解析为一组DOM元素,并将它们放入文档中。

$(data)然后将data解析为另一个DOM元素集,这些元素永远不会显示。

你想要

$(data).insertAfter(item).find(".focus").focus(); 

这是因为data在DOM中是而不是

试试这个:

  var item = $(this).closest(".something");
  $.get(
    url, 
    function(data) { 
      var $data = $(data);
      item.after($data);
      $data.find(".focus").focus(); /* everything works except this line */
      //or you can do: $(".focus", $data).focus();
    }
  );

Try,

item.next().find(".focus").focus();

尝试使用item.next().find('.focus').focus()。在Ajax回调中,data不是jQuery对象,而是一个HTML字符串;调用item.after()会使jQuery从HTML创建DOM节点,但它们不会链接到data变量。

这是因为您没有对添加到dom中的元素调用focus()

试试这个。

var item = $(this).closest(".something");
  $.get(
    url, 
    function(data) { 
      item.after(data);
      item.nextAll(".focus").focus(); /* everything works except this line */
    }
  );