مسج لا تعمل في الصفحة AJAX تحميل

StackOverflow https://stackoverflow.com/questions/1419433

سؤال

وأستخدمه مسج لتحميل الصفحة عن طريق AJAX باستخدام $ .ajax (test.html نفترض).
لها وثيقة HTML بسيطة مع بضعة أزرار والرسوم المتحركة المرتبطة بها على النقر عليها (أيضا باستخدام مسج). <ر > و. انقر () الخصائص المقترنة تعمل غرامة عندما كنت تحميل الصفحة مباشرة ولكن الأزرار لا تستجيب عند النقر عليها في النسخة تحميل 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>

وأرجو أن أكون أنا لا يجعل بعض الخطأ وقتا كبيرا؟

هل كانت مفيدة؟

المحلول

ويبدو أنك تحتاج 

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

و$. fn.live، كما تم تسجيلها معالجات الأحداث فقط على خلق دوم الأولي، وكنت إعادة إسكانها في DOM وتلك التي لا ترد.

http://docs.jquery.com/Events/live

نصائح أخرى

إذا أنا قراءة هذا الحق الذي تضيفه النقر معالجات في البداية. هذه تؤثر فقط على أزرار الحالية. قد تحتاج فقط إلى تغيير ذلك لحدث واقعي. 

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

وعلى العمل حدث المن الحالي في صفحتك وأي دوم تحميلها من قبل اياكس في المستقبل

مرخصة بموجب: CC-BY-SA مع الإسناد
لا تنتمي إلى StackOverflow
scroll top