使用追加（）

Question

 $(document).on('focus', '.resource_person', function() { 

     var topic_code = $(this).attr('id'); 
     var rp_reference = $(this).attr('selected-rp'); 
     var option = ''; 

     $.ajax({ 
      type: 'POST', 
      url: siteUrl + 'course_management/Training_courses/topic_rp', 
      data: {topic_code: topic_code}, 
      dataType: 'json', 
      success: function(source) { 
       $('.resource_person[id="'+topic_code+'"]').empty(); 

       for (var key in source) { 
        if (source[key] != rp_reference) { 
         option += '<option value="'+source[key]+'">'+key+'</option>'; 
        } else { 
         option += '<option value="'+source[key]+'" selected="">'+key+'</option>'; 
        } 
       } 

       console.log(option); 

       $('.resource_person[id="'+topic_code+'"]').append(option); 
      } 
     }); 
    }); 

This what was happening when I first click the dropdown

After clicking it for the second time it goes back to the normal behavior of dropdown

Answer 1

首先點擊它使請求導致延遲顯示項目時首先點擊爲什麼下拉顯示選項中的一個接一個，但它使用cahce第二個請求。

如果強制要求不使用緩存，相同的延遲會發生，每次：

$.ajax({ 
    cache: false, 
    //other options... 
}); 

注意：設置緩存爲false將只與HEAD和 GET請求正常工作。