0

场景:我有一个网络应用程序,用户可以在其中对事物进行投票,当他们进行下一次投票时,所有内容都会加载 ajax。用户还可以单击以前的投票,投票的详细信息会通过 ajax 加载到页面中。我遇到的问题是,当用户点击以前的投票时,页面最终会暂时冻结。这发生在第 7/8 次点击左右。在最初的几次点击中,所有的新信息都会超级快地加载到 dom 中,一切都很好。当页面确实冻结时,它会在 20-25 秒后解冻。

这是处理点击的 js func,然后我使用 js.erb 文件将新信息加载到 dom 中:

$('.vote.complete').click(function()
{
    whence = "toCompleted";
    vote_id = $(this).data('vote_id');
    cid = $(this).data('campaign_id');

    c_title = $('#outfitPair'+cid).data('campaign_title');
    u_id = $('#outfitPair'+cid).data('other_id');

    //_gaq = window._gaq;

  //if(_gaq != undefined){
   // _gaq.push(['_trackEvent', 'ViewPreviousVote', c_title, u_id]);
  //}

    $('#outfitPair'+cid).find('.button.vote').removeClass('to-vote');
    $(this).addClass('to-vote');

    $.get('/campaigns/new_pair?whence='+whence+'&vote_id='+vote_id)

return false;
});

js.erb 文件需要仔细查看。我或多或少地在寻找我可以调查的可能原因的建议,但鉴于这些信息很少,我不希望有任何确切的答案。

编辑:我相信我已经找到了解决这个问题的线索。看起来每次您单击旧投票时,它所做的 ajax 调用的数量都会增长两倍,而它应该只做一个。

http://i.imgur.com/QnvaaBD.png

4

2 回答 2

0

根据您的编辑,我会设置一个条件来防止 AJAX 进行额外的调用。

$('.vote.complete').click(function() {

if (!$(this).hasClass('loading')) {

     $(this).addClass('loading');

     $.get(url,function() {

          $(this).removeClass('loading');

     });

}

});
于 2013-08-08T15:32:11.333 回答
0

固定的。在我的 js.erb 文件中,我再次声明了单击处理程序,认为旧的处理程序在它仍然存在时不再被绑定。这最终导致了多次 ajax 调用,因为每次点击投票时点击处理程序的数量都会翻倍。从回调中删除点击处理程序后,现在一切都按预期工作。

于 2013-08-08T15:38:16.250 回答