jQuery不工作在AJAX加載頁面

我正在使用jQuery使用$ .ajax（假設test.html）通過AJAX加載頁面。
它是一個簡單的HTML文檔，點擊它們時也有幾個按鈕和相關的動畫（也使用jQuery）。
當我直接加載頁面時，與.click（）屬性相關的工作正常，但當我在AJAX加載版本中單擊它們時，按鈕無法響應。
由於我實在太無法解釋我所做的一切，所以我只是寫下所有的代碼，對此表示歉意。以下是文件中所需的代碼。jQuery不工作在AJAX加載頁面

<!-- p11.php --> 
<!DOCTYPE html"> 
<html> 
<head> 
    <title>jQuery</title> 
    <script type="text/javascript" src="c/js/jquery.js"></script> 
    <script type="text/javascript" src="c/js/jtry11.js"></script> 
    <link rel='stylesheet' type='text/css' href='c/css/css11.css'> 
</head> 
<body> 
    <button id="go1">Load Something Using AJAX</button> 
    <div id="msg"></div> 
    <div id="showButton"> 
     <button id="showLoadedPage">Show the Page</button> 
    </div> 
    <div id="results"></div> 
</body> 
</html>

和下

$(document).ready(function() 
{ 
    $('#results').hide(); 
    $('#msg').hide(); 
    $('#showButton').hide(); 
    $('#loading').hide(); 
    $('#loaded').hide(); 

    $('#load').live('click', function() 
    { 
     $('#load').hide(); 
     $('#loading').show(); 
     $('#msg').show('fast'); 
     $.ajax({ 
      url: 'test.html', 
      cache: false, 
      success: function(html) { 
        $('#results').append(html); 
      } 
     }); 
     $('#msg').ajaxSuccess(function(evt, request, settings){ 
      $(this).append('Click the Button Below to View the Page'); 
      $('#showButton').show('slow'); 
      $('#hideLoadedPage').hide(); 
      $('#loading').hide(); 
      $('#loaded').show(); 
     }); 
    }); 

    $('#showLoadedPage').live('click', function() { 
     $('#loaded').hide('slow'); 
     $('#msg').hide('slow'); 
     $('#results').show('fast'); 
     $('.shower').hide(); 
     $(this).hide(); 
     $('#hideLoadedPage').show(); 
    }); 

    $('#hideLoadedPage').live('click', function() { 
     $('#results').hide('fast'); 
     $('.shower').hide(); 
     $(this).hide(); 
     $('#showLoadedPage').show(); 
    }); 

    $('.hider').live('click', function() { 
     $('.shower').show(); 
     $(this).hide(); 
     $('p.one').hide('slow'); 
     $('p.two').hide('medium'); 
     $('p.three').hide('fast'); 
    }); 

    $('.shower').live('click', function() { 
     $('.hider').show(); 
     $(this).hide(); 
     $('p.one').show('slow'); 
     $('p.two').show('medium'); 
     $('p.three').show('fast'); 
    }); 

    $('p.*').live('click', function() { 
     $(this).hide('slow'); 
     if($('p').is(':hidden')) { 
      $('.shower').show(); 
     } 
     if($('p.*').is(':hidden')) { 
      $('.hider').show(); 
     } 
    }); 
});

最後

<!-- test.html --> 
Page Loaded by Ajax. 
Not the original Page 

<center> 
    <button class="hider"> 
     <img src="c/images/zoom_out.png" alt="zoom_out" /> 
     Hide 'em 
    </button> 
    <button class="shower"> 
     <img src="c/images/zoom_in.png" alt="zoom_out" /> 
     Show it 
    </button> 
    <p class="one">Hiya</p> 
    <p class="two">Such interesting text, eh?</p> 
    <p class="three">The third Paragraph</p> 
</center>

我希望我沒有做一些大的時候的錯誤？

來源

2009-09-14 OrangeRind

聽起來像是你需要

$('#go1').live('click', function() {});

$ .fn.live，作爲事件處理程序只在初始DOM創建註冊，和你重新填充DOM以及那些沒有連接。

更多信息@http://docs.jquery.com/Events/live

來源

2009-09-14 02:23:31

仍然沒有工作:( – OrangeRind 2009-09-14 02:30:52

你可以用更新的代碼更新的說明，或粘貼一個活鏈接加載事件的工作？你確實記得要替換所有* .click事件句柄賦值，它們需要重新應用$（'selector'）。live（'click'，function（）{}）;？ – 2009-09-14 02:35:48

Yes it Works now！Thanks！In我第一次只是在go按鈕中替換它，但是現在我完成了它。.click和.live（）之間的區別究竟是什麼？這是否意味着我可以使用.live來代替點擊？ – OrangeRind 2009-09-14 08:26:46

如果我讀這個權利，你在開始處添加點擊處理程序。這些僅影響當前按鈕。您可能需要將其更改爲Live活動。

來源

2009-09-14 02:24:03

$("#peopleResult_list").on('click','a', function(event){ 
    //do you code here 
});

對在當前頁面的DOM和DOM任何AJAX通過在未來

來源

2012-08-31 09:10:14

jQuery不工作在AJAX加載頁面

回答

相關問題