الوصول إلى عناصر DOM بعد اياكس.تحميل

Question

انا إدراج HTML استجابة من اياكس الاتصال في بلدي الصفحة ، ولكن بعد ذلك عندما كنت في محاولة للوصول إلى تلك العناصر بعد أن تم إنشاؤها ، فإنه يفشل..

هذا هو كيف يمكنني استرداد إدراج HTML:

$.ajax({url: 'output.aspx',
   data: 'id=5', 
   type: 'get', 
   datatype: 'html',
   success: function(outData) {$('#my_container').html(outData);} 
})

نتائج HTML التي يتم إدراجها في <div> (id = my_container) يبدو مثل:

<div id="my_container">
   <ul>
      <li id="578" class="notselected">milk</li>
      <li id="579" class="notselected">ice cream</li>
      <li id="580" class="selected">chewing gum</li>
   </ul>
</div>

و بعد ذلك عند محاولة الوصول إلى أي من <li> العناصر باستخدام استعلامات مثل:$('#my_container li:first') أو $('#my_container ul:first-child') أو ما شابه ذلك, لا شيء يحصل المختارة.

أنا باستخدام الاستماع المساعد للكشف عن أي فوق الأحداث على <li>عناصر يعمل...ولكن لم أتمكن من معرفة كيفية الكشف عن إذا كان div يتم ملؤها مع الإخراج HTML و تبعا لذلك تغيير أحد <li>'ق الدرجة على سبيل المثال...

$(document).ready لا يعمل إما...

تخيل أنا بحاجة إلى تغيير نمط css الثانية <li>..ما هو الحل لهذا ؟

Answer 1

وكيف حالك فحص لمعرفة ما إذا كان قد أكمل دعوة AJAX لديك؟ لأنه غير متزامن، العناصر لن، بطبيعة الحال، سوف تكون متاحة لرمز الذي ينفذ على الفور بعد المكالمة $.ajax(…) الخاص بك.

وحاول التلاعب تلك العناصر من ضمن الدالة success أو في التعليمات البرمجية الأخرى التي يتم استدعاؤها من هناك - في تلك المرحلة، وسوف تعرف أن المحتوى متاح

.

Answer 2

هل أنت متأكد من الطلب الفعلي غير ناجحة؟ إذا تم تحديد أي شيء، هو أن لا شيء تم إدراج السبب على الأرجح في الواقع إلى #my_container في المقام الأول.

Answer 3

أولا، حاول التعليمة البرمجية التالية (بدلا من AJAX الأصلي ندعو لكم أظهرت):

var html = $.ajax({url: 'output.aspx',
   data: 'id=5', 
   type: 'get', 
   datatype: 'html',
   async: false
}).responseText;
$('#my_container').html(html);

إذا أن يعمل، هو مجرد يتم استدعاء محدد li:first قبل انتهاء طلب AJAX. إذا لم يفلح ذلك، حاول التعليمة البرمجية التالية:

$.ajax({url: 'output.aspx',
   data: 'id=5', 
   type: 'get', 
   datatype: 'html',
   success: function(outData) { $('#my_container').html(outData); }, 
   error: function(errorMsg) { alert('Error occured: ' + errorMsg); }
});

وهذا سوف يسبب رسالة خطأ ليطفو على السطح إذا فشل الطلب. إذا ملوثات العضوية الثابتة رسالة خطأ مع رسالة خطأ، وطلب عدم العودة.

Answer 4

إنه يبدو أنك تحاول الوصول إلى تلك العناصر قبل خلق الحالي اياكس استدعاء غير متزامن ، محاولة وضع الخيار:"async=false" إلى اياكس و يجب أن يكون العمل.