आईई 8: ऑब्जेक्ट संपत्ति या विधि 'getElementsByClassName'

Question

मैं diapo स्लाइडर जो इंटरनेट एक्सप्लोरर 8

के अलावा सभी अन्य ब्राउज़रों में काम करने के लिए डिबग मोड मैं में IE8 चलाने के बाद लगता है उपयोग कर रहा हूँ का समर्थन नहीं करता निम्न त्रुटियों:

SCRIPT438: Object doesn't support property or method 'getElementsByClassName' prototype.js, line 5988 character 5

return function(className, parentElement) { 
    return $(parentElement || document.body).getElementsByClassName(className); 
    }; 

SCRIPT438: Object doesn't support property or method 'fireEvent' prototype.js, line 5736 character 7

if (document.createEvent) 
     element.dispatchEvent(event); 
    else 
     element.fireEvent(event.eventType, event); 

    return Event.extend(event); 

मैं Magento मंच में इस स्लाइडर चला रहा हूँ और यह है कि प्रोटोटाइप scr लगता है समस्या में एक आईपीटी। इसका उपयोग प्रोटोटाइप का संस्करण 1.7 है जो स्क्रिप्ट अपडेट के संभावित फ़िक्स को इंगित करता है।

नोट: हालांकि, मैं IE9 में एक प्रदर्शन समस्या आ नहीं कर रहा हूँ, मैं निम्नलिखित त्रुटि हो रही है:

SCRIPT438: Object doesn't support property or method 'dispatchEvent' prototype.js, line 5734 character 7

if (document.createEvent) 
     element.dispatchEvent(event); 
    else 
     element.fireEvent(event.eventType, event); 

    return Event.extend(event); 

इन लिपियों कि diapo स्लाइडर काम करने के लिए आवश्यक हैं कर रहे हैं, हेडर में स्क्रिप्ट टैग के साथ लोड किया गया। मुझे यकीन है कि नहीं कर रहा हूँ लेकिन शायद ये स्क्रिप्ट के कुछ मौजूदा स्क्रिप्ट के साथ परस्पर विरोधी हैं:

<script type='text/javascript' src='http://www.pixedelic.com/plugins/diapo/scripts/jquery.min.js'></script> 
<script type='text/javascript' src='http://www.pixedelic.com/plugins/diapo/jquery.mobile-1.0rc2.customized.min.js'></script> 
<script type='text/javascript' src='http://www.pixedelic.com/plugins/diapo/jquery.easing.1.3.js'></script> 
<script type='text/javascript' src='http://www.pixedelic.com/plugins/diapo/jquery.hoverIntent.minified.js'></script> 
<script type='text/javascript' src='http://www.pixedelic.com/plugins/diapo/scripts/diapo.js'></script> 

Answer 1

IE8 not समर्थन getElementsByClassName करता है। हालांकि, यह does समर्थन querySelectorAll समर्थन करता है। तो, मैं querySelectorAll का उपयोग करके एक पॉलीफिल लिखने का सुझाव देता हूं।

document.getElementsByClassName('foo') 

में

document.querySelectorAll('.foo'); // Prefixed dot. 

नोट चला है कि Prototype.js deprecates the use of getElementsByClassName in favour of $$ और Element#select।

IE8 लिए एक त्वरित सुधार:

<!--[if IE 8]><script> 
document.getElementsByClassName = 
Element.prototype.getElementsByClassName = function(class_names) { 
    // Turn input in a string, prefix space for later space-dot substitution 
    class_names = (' ' + class_names) 
     // Escape special characters 
     .replace(/[~!@$%^&*()_+\-=,./';:"?><[\]{}|`#]/g, '\\$&') 
     // Normalize whitespace, right-trim 
     .replace(/\s*(\s|$)/g, '$1') 
     // Replace spaces with dots for querySelectorAll 
     .replace(/\s/g, '.'); 
    return this.querySelectorAll(class_names); 
}; 
</script><![endif]--> 

नोट्स:

• यह कई वर्ग नामों का समर्थन करता है।
• यह खाली ('') वर्ग नामों का समर्थन नहीं करता है। यदि आप चाहें तो इनके लिए समर्थन जोड़ना मुश्किल है।

डेमो: http://jsfiddle.net/HL4FL/21/