setInterval在生成30多个数据时启动页面滞后

时间:2014-03-18 11:18:49

标签: javascript php jquery mysql json

任何人都可以帮我解决setInterval的问题,因为如果它在我的页面中的静态pause and resume中生成30 plus more data,就会在我的页面中发生textboxes事件。有谁知道如何在我的问题中解决lagg问题?

<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>

1 个答案:

答案 0 :(得分:2)

您每500毫秒执行一次异步请求,因此很可能他们将开始排队,您的浏览器将无法及时完成。

您可以增加时间间隔,但最好还是删除setInterval,只有在完成时才会执行另一个请求,即在success函数内:

E.g。

success: function(result) {
...
//at the end of the function
updateTextboxes(); //or setTimeout(updateTextboxes, 500);
}

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

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

或使用jQuery

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