的jQuery - Javascript語言，迴應

Question

我有一些問題與使用jQuery

HTML

<div class="dnone team_data" id="team_<?php echo $allnum; ?>" style="padding: 10px; margin: 2px 0 2px 0; border: 1px solid <?php echo $site_color; ?>;"> 
<div class="ajax-json-loading"></div> 
<div class="ajax-json-response"></div> 
<table cellspacing="5"> 
    <tr> 
     <td valign="top" style="width: 100px;"> 
      <b>Csapat vezető:</b> 
     </td> 
     <td class="team-leader-area"> 
      <input type="hidden" class="team-leader-hidden-id" value="<?php echo $value['leader']; ?>" /> 
      <div class="team-leader-id"><a href="http://lanseries.hu/index.php?oldal=profile&p_id=<?php echo $value['leader']; ?>" target="_blank"><?php echo $value['leader']; ?></a></div> 
      <div class="team-leader-modify"><a href="javascript:void(0);">Módosít</a></div> 
     </td> 
    </tr> 
    <tr> 
     <td valign="top" style="width: 100px;"> 
      <b>Befizető címe:</b> 
     </td> 
     <td> 
      <?php echo $value['p_address']; ?> 
     </td> 
    </tr> 
</table></div> 

而jQuery的

$(document).ready(function() { 
$('.team-leader-modify a').click(function(){ 
    var action = $(this).text(); 
    if (action == 'Módosít') { //Option 1 
     var value = $(this).parents('.team_data').find('.team-leader-hidden-id').val(); 
     $(this).parents('.team_data').find('.team-leader-id').html('<input type="text" name="leader-id" class="leader-id" value="'+value+'" /><input type="button" name="team-leader-mod-button" class="team-leader-mod-button" value="módosít" />'); 
     $(this).parents('.team_data').find('.team-leader-modify').html('<a href="javascript:void(0)">Mégse</a>'); 
    } 
    if (action == 'Mégse') { //Option 2 
     var value = $(this).parents('.team_data').find('.team-leader-hidden-id').val(); 
     $(this).parents('.team_data').find('.team-leader-id').html('<a href="http://lanseries.hu/index.php?oldal=profile&p_id='+value+'" target="_blank">'+value+'</a>'); 
     $(this).parents('.team_data').find('.team-leader-modify').html('<a href="javascript:void(0)">Módosít</a>'); 
    } 
}); }); 

我點擊a後DOM後加載它顯示了option 1正確，但在單擊option 1中的a後，它不顯示option 2。

你能幫我嗎？

感謝：馬塞爾

Answer 1

如果我理解正確的話，你的問題是，你要插入一個新元素到DOM，所以click事件處理程序將不會被連接到它。您可以使用jQuery的live或delegate方法將事件處理程序附加到現有元素，並且在未來的增加：

$('.team-leader-modify a').live("click", function(){ 
    //Your function 
}); 

或者與delegate：

$('.team-leader-modify').delegate("a", "click", function(){ 
    //Your function 
}); 

我會建議使用delegate，這提供更好的性能，因爲jQuery不必監視整個DOM中的新元素，僅僅是選定的元素。