2014-11-25 152 views
0

我遇到了一些麻煩,我的jQuery ajax代碼。 我有兩個函數,一個會提交一個值,另一個會實時更新值。至少這是它應該做的。 :Pjquery div和類衝突

所以,我有一個throught一些PHP代碼中創建一個列表:

<div id="votos"> 
    <ul class="yourvotes">Your votes: 0</ul> 
    <li class="votesofothers"> 
     <a href="#" class="votar" id="3124" iduser="3124" rel="Votar">User</a> Votes: (0)</br> 
     <a href="#" class="votar" id="3125" iduser="3125" rel="Votar">User2</a> Votes: (0)</br> 
    </li> 
    </ul> 
</div> 

然後,我有一個Ajax調用來更新當按下其中一個鏈接數據庫:

$(function(){ 
    $('.votar').click(function(){ 
     var elem = $(this); 
     $.ajax({ 
      type: "GET", 
      url: "votar.php", 
      data: "id="+elem.attr('iduser'), 
      dataType:"json", 
      success: function() { 
       window.location.reload(true); 
      } 
     }); 
     $(document).ajaxStop(function(){ 
      window.location.reload(); 
     }); 
     return false; 
    }); 
}); 

,這將是更新出現在「實時」的值代碼:

function mostrarvotos() { 
    $('#votos').load('votos.php'); 
    setTimeout('mostrarvotos()',1000); 
} 
mostrarvotos(); 

(我原點盟友想更新每個用戶投票,而不是更新整個div,但我無法做到這一點)。

所以我的問題是,當我將「mostrarvotos()」函數添加到我的代碼鏈接停止工作,只是添加一個#的網址,但如果我刪除它一切工作正常..如果你能幫助我,我將不勝感激。

+0


所以做這樣的事情? – putvande 2014-11-25 12:41:41

回答

0

這是因爲你不能阻止鏈接的原始動作。使用AJAX請求刷新內容時,點擊處理程序不會捕獲該事件。嘗試document.on,代替目前的處理程序:

$(document).on('click','.votar',function(e){ 
    e.preventDefault(); //Prevent the default action 
    var elem = $(this); 
    $.ajax({ 
     type: "GET", 
     url: "votar.php", 
     data: "id="+elem.attr('iduser'), 
     dataType:"json", 
     success: function() { 
      window.location.reload(true); 
     } 
    }); 
    $(document).ajaxStop(function(){ 
     window.location.reload(); 
    }); 
    return false; 
}); 

還要注意防止的defauls鏈接動作(#在地址欄中)的preventDefault

+0

非常感謝!這樣做的工作! ;) – 2014-11-25 12:46:25

+0

@SteveGarret這就是所謂的代表團,在處理動態內容時(例如S.Pols和putvande都應該這樣做),您應該總是進行委託。但我認爲你的問題是你忘記了'e.preventDefault()'。 – 2014-11-25 12:48:54

0

您需要委派您的點擊功能,因爲您正在動態添加這些鏈接。你爲什麼要使用Ajax和重新加載頁面

$(function() { 
    // delegate your dynamically loaded links 
    $('#votos').on('click', '.votor', function() { 
     var elem = $(this); 
     $.ajax({ 
      type: "GET", 
      url: "votar.php", 
      data: "id=" + elem.attr('iduser'), 
      dataType: "json", 
      success: function() { 
       window.location.reload(true); 
      } 
     }); 
     $(document).ajaxStop(function() { 
      window.location.reload(); 
     }); 
     return false; 
    }); 
});