jquery ajax：獲取焦點後新的輸入字段失去焦點

Question

我試圖在ajax更新期間專注於新創建的輸入元素，但焦點以某種方式丟失。

 var options = { 
      url: aURL, 
      type: "POST",     
      dataType: "xml", 
      data: params,   
      success: function(responseData, status, xhr) { 
       // replace DOM element 
       $(".placeholder").html(responseData); 
      } 
     }; 

     $.ajax(options); 

的responseData裏面，有一個腳本

<script>$(function(){createInputAndFocus();});</script> 

該腳本將阿賈克斯的DOM更新過程中被執行。

function createInputAndFocus() { 
    $(".placeholder").append('<input type="text" id="foo"/>'); 
    $(".placeholder").find("#foo").focus(); 

    // debug: check if it is focused 
    console.log("active element: " + document.activeElement.id); 
} 

從瀏覽器控制檯中，創建的輸入（foo）被關注。但是在ajax完成後，它不會在屏幕上聚焦（突出顯示）。從控制檯，驗證它不重點。 document.activeElement與ajax更新之前的相同。

jquery是否在ajax之後恢復原始焦點？如何在ajax更新後關注新的輸入元素？我試圖設置一個計時器

function createInputAndFocus() { 
     $(".placeholder").append('<input type="text" id="foo"/>'); 
     $(".placeholder").find("#foo").focus(); 

     setTimeout(function() {$(".placeholder").find("#foo").focus();}, 3000); 
    } 

計時器工作。計時器不是安全的解決方案。如果將超時設置得太短，超時可能會被觸發得太早，如果將超時設置太長，用戶必須等待。感謝幫助。

Answer 1

可你剛纔所說的

createInputAndFocus(); 

直接從成功（）方法

？否則，您可以嘗試向選項中添加async = false，但這可能會降低性能。