Selectivizr IE8 में खोलने के लिए दो क्लिक की आवश्यकता के लिए ड्रॉपडाउन का चयन करता है और

Question

मैंने हाल ही में एक आंतरिक कंपनी वेबसाइट पर Selectivizr लागू किया है क्योंकि हमें आईई 7/8 का समर्थन करने की आवश्यकता है। दुर्भाग्य से, हमारी साइट jQuery/AJAX के माध्यम से बहुत गतिशील सामग्री लोडिंग करता है।

इस समस्या को हल करने के लिए, मैंने चयनकर्ता को फिर से लोड करने के लिए jQuery तैयार फ़ंक्शन को अधिभारित किया, इसके बाद यह जो भी कार्य निर्धारित किया गया था। मेरा कोड इस तरह दिखता है:

$(function() { 
    if ($('body.ie8, body.ie7, body.comp-view8, body.comp-view7').length > 0) { 
     (function() { 
      var original = jQuery.fn.ready; 
      var getSelectivizr; 
      jQuery.fn.ready = function() { 
       // Execute the original method. 
       original.apply(this, arguments); 

       clearTimeout(getSelectivizr); 
       getSelectivizr = setTimeout(function() { 
        $.getScript(selectivizr); 
       }, 50); 
      } 

     })(); 
    } 
}); 

काफी सरल। हालांकि, एक टीम के साथी ने हाल ही में एक बग की खोज की जो संबंधित प्रतीत होता है। IE8/7 में किसी भी ड्रॉपडाउन को जो पृष्ठ में गतिशील रूप से लोड किया गया है (मुझे यकीन नहीं है कि स्थिर ड्रॉपडाउन प्रभावित होते हैं और साथ ही इन पृष्ठों में से कोई भी नहीं है), इसे खोलने के लिए दो क्लिक की आवश्यकता होती है।

आईई 8/7 में अधिक विशिष्ट होने के लिए, पहला क्लिक ड्रॉपडाउन पर "फोकस" लगता है, जबकि दूसरा इसे खोलता है। यह संगतता दृश्य, यह वास्तव में एक विभाजन के लिए खुलता है और फिर बंद हो जाता है। दूसरा क्लिक इसे ठीक करता है (जब तक आप ड्रॉपडाउन पर ध्यान केंद्रित करते हैं)।

मैंने माना था कि यह चयनकर्ता क्या कर रहा था के साथ एक मुद्दा हो सकता है, क्योंकि यह वास्तव में गतिशील रूप से लोड की गई सामग्री के साथ काम करने के लिए डिज़ाइन नहीं किया गया था, लेकिन कुछ डिबगिंग के बाद, ऐसा लगता है कि यह सेटटाइमआउट है जो इसका कारण बन रहा है अजीब सा व्यवहार।

मैं पूरी तरह से नुकसान पर हूं मेरे चयनकर्ता कार्यान्वयन को हटाने के बिना इसे ठीक करें।

शायद यह ध्यान देने योग्य है कि ब्राउज़र को अलग-अलग AJAX कॉल किए जाने पर ब्राउज़र को चुनने के लिए सेटटाइमआउट आवश्यक है क्योंकि इससे ब्राउज़र में गंभीर प्रदर्शन समस्याएं हो सकती हैं।

नोट: यह प्रश्न शीर्षक में बताई गई समस्या को सटीक रूप से प्रतिबिंबित नहीं करता है, इसलिए मैंने इसे बेहतर खोज प्रदान करने के लिए अपडेट किया है! कुछ हफ्ते बाद इस समस्या पर वापस आने के बाद, मुझे पता चला कि मेरी शुरुआती डीबगिंग ने मुझे गलत रास्ता नीचे ले जाया था। क्षमा करें दोस्तों, लेकिन मैंने इसका उत्तर दिया है जो मुझे आशा है कि मदद करता है! :)

Answer 1

तो, मुझे अंत में इस बग पर वापस जाने का मौका मिला और ऐसा लगता है कि समाधान मुझे देख रहा था सभी के साथ सामना करना, मैंने अपने शुरुआती डीबगिंग को पकड़ने के कारण इसे पूरी तरह याद किया था।

यह पता चला कि यह सभी के साथ एक चुनिंदा समस्या थी। दुर्भाग्यवश, आईई 8 में एक चुनिंदा बॉक्स में गतिशील रूप से (जेएस) को किसी भी प्रकार का परिवर्तन करना और नीचे इसे फिर से खींचा जा सकता है, जो इसे बंद करने के लिए मजबूर करता है (या संस्करण/मोड के आधार पर कभी नहीं खुलता है)। जिस तरह से selectivizr काम करता है वह यह है कि यह छद्म वर्गों के व्यवहार की नकल करने के लिए जेएस का उपयोग करके तत्वों को एक वर्ग को "slvzr-focus" जैसा जोड़ता है; इस मामले में "फोकस"।

इस तरह, इस तरह के पैच को फोकस पर चुनने के लिए चुनिंदाविज़र को बस प्रतिबंधित करने से यह समझ में आया। मेरा समाधान निम्नानुसार है, हालांकि यह सभी के लिए नहीं हो सकता है (वैकल्पिक रूप से, आप यह सुनिश्चित कर सकते हैं कि आपके सीएसएस में "फोकस" चयनकर्ता मौजूद नहीं हैं, जो चुनिंदाविज़र को घटना को कभी भी आग नहीं पहुंचाएगा):

1) selectivizr में निम्न पंक्ति खोजें।js:

if (!hasPatch(elm, patch)) { 

    if (patch.applyClass && (patch.applyClass === true || patch.applyClass(elm) === true)) { 

     cssClasses = toggleClass(cssClasses, patch.className, true); 
    } 

} 

2) के साथ लपेटें निम्नलिखित अगर बयान:

if (!(elm.tagName == 'SELECT' && patch.className == 'slvzr-focus')) { 
} 

3) ब्लॉक इस तरह दिखना चाहिए आपका कार्य पूर्ण होने:

if (!(elm.tagName == 'SELECT' && patch.className == 'slvzr-focus')) { 
    if (!hasPatch(elm, patch)) { 

     if (patch.applyClass && (patch.applyClass === true || patch.applyClass(elm) === true)) { 

      cssClasses = toggleClass(cssClasses, patch.className, true); 
     } 
    } 
} 

आशा है कि एच वहां से बाहर निकलता है।

धन्यवाद एस/ओ!