2012-08-01 20 views
7

से पार्स किए गए एचटीएमएल में अपेक्षित व्यवहार के रूप में व्यवहार नहीं कर रहा है, आज मैं एक अजीब मुद्दे में भाग गया हूं, मुझे आशा है कि कोई और मुझे यह समझने में मदद कर सकता है।jQuery चयनकर्ता एजेक्स

जिस परियोजना पर मैं काम कर रहा हूं वह एक jQuery स्लाइड शो कम या कम है।

<!doctype html public "(╯°□°)╯︵ ┻━┻"> 
    <html> 
     <head> 
      <meta charset="utf-8"> 
      <title>test</title> 
     </head> 
     <body> 
      <div id="slides" data-slidesShow="holder"> 
       <div class="slide" id="test1">test div 1</div> 
       <div class="slide" id="test2">test div 2</div> 
       <div class="slide" id="test3">test div 3</div> 
      </div> 

      <button id="previous">previous</button> 
      <button id="next">next</button> 

      <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> 
      <script>window.jQuery || document.write('<script src="js/libs/jquery-1.7.2.min.js"><\/script>')</script> 

      <script type="text/javascript" src="js/slides.js"></script> 

      <?php include 'footer.php'; ?> 
     </body> 
    </html> 

फिर, कुछ भी नहीं है यहां तक ​​कि दूर से यहाँ कल्पना: मैं एक सुपर सरल फ़ाइल है कि मैं सब कुछ बाहर का परीक्षण करने के लोड हो रहा है कर रहा हूँ है, यह इस तरह दिखता है।

अब, jQuery में मैं हो रही है और इस तरह के पेज को पार्स:

$.ajax({ 
    url:  target.path, 
    dataType: "html", 
    complete: function(data){ 
     var $slides  = $('[data-slidesShow="holder"]', $(data.responseText)); 

     console.log($slides); // returns [] 
    } 
}); 

लेकिन! $ स्लाइड एक खाली सरणी देता है, जब तक कि मैं एक अर्थहीन div में लपेट, जैसे:

<div class="stupid-wraper-div-that-i-dont-want-or-need"> 
    <div id="slides" data-slidesShow="holder"> 
     <div class="slide" id="test1">test div 1</div> 
     <div class="slide" id="test2">test div 2</div> 
     <div class="slide" id="test3">test div 3</div> 
    </div> 
</div> 

और अब:

console.log($slides); // returns [<div id="slides" data-slideShow="holder">...</div>] 

मैं इस (http पर jQuery डॉक्स से अधिक पढ़ा है: // api.jquery.com/jQuery/) और अन्य StackOverflow वार्तालाप, लेकिन उनमें से कोई भी समझाता है कि परिणाम लौटने के लिए मुझे एक रैपर div की आवश्यकता क्यों होगी।

कोई भी विचार? मुझे पता है कि यह एक बड़ा मुद्दा नहीं है, लेकिन जब मैं समस्या की जड़ पा सकता हूं तो मैं एक फिक्स हैक करना नहीं चाहता हूं।

...

टी एल; डॉ: jQuery के दायरे में चयन केवल एक अजीब आवरण div

+1

+1 तालिका फ्लिप –

+0

के लिए:

आप .filter() बजाय जो बजाय तत्वों का एक सेट फिल्टर उनके वंश की खोज का उपयोग करना चाहिए। आपका स्वागत है भाई :) –

उत्तर

3

जब आप $() पर कोई संदर्भ पास करते हैं, तो आप चयनित तत्व के लिए चयनकर्ता से अपने वंशजों को देखने के लिए कह रहे हैं (यह .find() जैसा काम करता है)। आपके रैपर div के बिना, जिस तत्व को आप ढूंढ रहे हैं वह संदर्भ तत्व है, इसलिए आपका चयनकर्ता इसे ढूंढने में सक्षम नहीं होगा क्योंकि यह इसके अंदर दिख रहा है। तत्काल उसे +1 Redditor टेबल flipping के लिए

var $slides = $(data.responseText).filter('[data-slidesShow="holder"]'); 
+0

बिल्कुल वही जो मैं खोज रहा था! और यह अब सही समझ में आता है कि यह समझाया गया है, मुझे लगा जैसे यह उन पंक्तियों के साथ कुछ होगा। –

2

आप फिल्टर का उपयोग करने की आवश्यकता के साथ काम करता है।

$(data.responseText).filter('[data-slidesShow="holder"]') 

एचटीएमएल और बॉडी टैग ब्राउजर द्वारा अपनी सामग्री छोड़कर छीन लिया जाता है।

संबंधित मुद्दे