2014-01-19 124 views
0

我有一個功能replaceWith()的問題。Replacewith()Jquery

我創建了一個日曆。當我選擇一天時,我出現了代替數字的交叉(添加事件)。

如果我點擊另一天,將再次顯示第一個選定日期的編號,十字會出現在我的第二個選擇中。

但是,如果我嘗試再次點擊第一個選項,沒有任何反應(沒有交叉)。

這裏是測試鏈接,它會更清楚:http://www.fatal-destiny.com/calendrier/

$(document).ready(function() { 
$('#calendrier td a').click(function(){ 

    var nbReplace = $("span[class='replace']").length; 
    if(nbReplace > 0) 
    { 
     var nbEvenements = $("span[data-evenement='1']").length; 
     var jour = $("span[class='replace']").attr('data-valeur'); 
     var dateComplete = $("span[class='replace']").attr('data-date'); 
     if(nbEvenements > 0) 
      $("span[class='replace']").replaceWith('<a href="#" class="'+dateComplete+'" style="display: inline-block;width: 200px; height: 120px; line-height: 120px; color: #ce2d2d;">'+jour+'</a>'); 
     else 
      $("span[class='replace']").replaceWith('<a href="#" class="'+dateComplete+'" style="display: inline-block;width: 200px; height: 120px; line-height: 120px;">'+jour+'</a>'); 
    } 

    var elemH2 = $(this); 
    var elem = $(this).attr('class'); 
    var res = elem.split("-"); 
    $.get("charger_nb.php", { date: elem }, function(data) { 
     if(data == 0) 
      elemH2.replaceWith('<span class="replace" data-valeur="'+res[0]+'" data-date="'+elem+'"><a href="#" onClick="ajouterEvenement(\''+elem+'\'); return false;"><img src="images/ajouter.png" alt="Ajouter" title="Ajouter un événement" class="opacite" /></a></span>'); 
     else 
      elemH2.replaceWith('<span class="replace" data-valeur="'+res[0]+'" data-date="'+elem+'" data-evenement="1"><a href="#" onClick="ajouterEvenement(\''+elem+'\'); return false;"><img src="images/ajouter.png" alt="Ajouter" title="Ajouter un événement" class="opacite" /></a> <a href="#" onClick="voirEvenement(\''+elem+'\'); return false;"><img src="images/voir.png" alt="Voir" title="Voir les événements" class="opacite" /></a></span>'); 
    }); 
}); 
}); 

的想法?

您在事件處理程序的目標

回答

1

整個錨元素被替換爲跨度,那麼它再放回,但現在的錨動態插入,你會需要委派事件

更換

$('#calendrier td a').click(function(){ 

$('#calendrier').on('click', 'td a', function(){