Javascript setInterval在生成30多个数据时会使页面延迟

有人能帮我解决setInterval的问题吗？因为它开始像

暂停和恢复

一样滞后。如果它在我的页面中的静态

文本框中生成
30加上更多的数据
，我的页面中就会发生这种情况。有人知道如何解决我问题中的滞后问题吗

<script>
$(document).ready(function(){

var $funiq_id         = $('#funiq_id'),
    $t_region         = $('#t_region'),
    $t_town           = $('#t_town'),
    $t_uniq_id        = $('#t_uniq_id'),
    $t_position       = $('#t_position'),
    $t_salary_grade   = $('#t_salary_grade'),
    $t_salary         = $('#t_salary');
var auto_refresh = setInterval(
function updateTextboxes(){
        $.ajax({
        url:"search.php",
        type:"GET",
        data: { term : $('#query').val() },
        dataType:"JSON",
        success: function(result) {

        var ii = 1;

        for (var i = 0; i < result.length; i++) { 
                    $funiq_id.html(result[i].value).show(); 
                    $t_region.val(result[i].region).show().trigger('input');
                    $t_town.val(result[i].town).show().trigger('input'); 
                    $t_uniq_id.val(result[i].uniq_id).show().trigger('input'); 
                    $t_position.val(result[i].position).show().trigger('input');
                    $t_salary_grade.val(result[i].salary_grade).show().trigger('input'); 
                    $t_salary.val(result[i].salary).show().trigger('input');
                    $('#id'+ii+'').val(result[i].atid).show().trigger('input');
                    $('#aic'+ii+'').val(result[i].atic).show().trigger('input');
                    $('#name'+ii+'').val(result[i].atname).show().trigger('input');
                    $('#other_qual'+ii+'').val(result[i].other_sum).show().trigger('input');
                    $('#interview'+ii+'').val(result[i].interview_sum).show().trigger('input');
                    $('#optA'+ii+'').val(result[i].edu_attain2_sum).show().trigger('input');
                    $('#optB'+ii+'').val(result[i].experience2_sum).show().trigger('input');
                    $('#optC'+ii+'').val(result[i].trainings2_sum).show().trigger('input');
                    $('#optD'+ii+'').val(result[i].eligibility2_sum).show().trigger('input');
                    $('#total'+ii+'').val(result[i].final_total_sum).show().trigger('input');
                    $(':input').removeAttr('placeholder');
            ii++;
            }

        }


    });


},500);
         $('.search_form_input').val('');
         $('.search_textbox').val('');
         $(".empty_batchcode").html("");
         $('#execute').prop('disabled', true);


});      
</script>


$（文档）.ready（函数（）{
变量$funiq_id=$（'funiq_id'），
$t#U区域=$（“#t#U区域”），
$t#u town=$（“#t#u town”），
$t#u uniq_id=$（'t#u uniq_id'），
$t#U位置=$（“#t#U位置”），
$t#U salary_grade=$（'t#U salary_grade'），
$t#U salary=$（'t#U salary'）；
var auto_refresh=setInterval(
函数updateTextBox（）{
$.ajax({
url:“search.php”，
键入：“获取”，
数据：{term:$（'#query'）.val（）}，
数据类型：“JSON”，
成功：功能（结果）{
var ii=1；
对于（var i=0；i
您每500毫秒执行一次异步请求，因此它们可能会开始排队，而您的浏览器将无法及时完成它们

您可以增加间隔，但最好删除
setInterval
，并且只在完成后执行另一个请求，即在
success
函数中：

例如

如果您只想在输入更改后调用它，那么您可以完全删除
setInterval/setTimeout
，只需附加到或事件，例如

<input id='search' type="text" onkeydown="updateTextboxes()">

您应该重新考虑您的逻辑，首先在ajax完全回调中使用超时，而不是间隔和回调超时。不管怎样，你似乎用这么少的时间做了太多的事情。我真的不明白为什么你需要在一个间隔/超时中调用它，而不是使用相关的处理程序作为textbox的onchange事件，如果我删除setInterval并且只在它完成时执行另一个请求，那么我的整个脚本将无法工作。如果我在搜索框中键入setInterval，那么脚本中的setInterval就是让我的脚本一直工作的输入。在这种情况下，当搜索输入的值更改时，只需调用
updatetextboxs
。因此，您可以将其附加到
onkeydown
或
onblur
事件，例如
我尝试了keydown和blur事件，但我的数据不会显示，因此我的最后手段是使用jQuery change的setIntervalTry（如上所述）。如果jQuery或blur/keydown不起作用，那么您需要在
updatetextboxs
中放置一个警报或其他东西，以确保调用它。还要查看页面上是否存在任何JavaScript错误。
<input id='search' type="text" onkeydown="updateTextboxes()">

$('#search').change(updateTextboxes);