jquery का शो/छुपा कार्य कैसे काम करता है?

Question

मुझे टॉगल दृश्यता फ़ंक्शन के साथ कोई समस्या है जो किसी तत्व की hidden विशेषता पर संचालित होती है। मुसीबत यह अभाव है ब्राउज़र संगतता है, ..

function hide(e) {$(e).hidden=true;}  
function show(e) {$(e).hidden=false;} 

इस मुद्दे मैं style.display संपत्ति टॉगल, इसलिए तरह की विधि में आए ..

function toggle(e) { 
document.getElementById(e).style.display = (document.getElementById(e).style.display == "none") ? "block" : "none"; 
} 

..लेकिन Googling इस उप लगता है इष्टतम, क्योंकि आपके पास एक सामान्य शो/छुपा कार्य नहीं हो सकता है जो प्रदर्शन गुण को block पर सेट करता है। क्या होगा यदि कभी-कभी प्रश्न में तत्व inline या कुछ होना चाहिए?

उदाहरण के लिए jQuery इस समस्या को हल कैसे करता है?

Answer 1

यह विशेषता olddisplay नामक विशेषता display मान को संग्रहीत करता है और उसके बाद तत्व को फिर से दिखाते समय इसे पुनर्स्थापित करने के लिए उस मान का उपयोग करता है। See the implementation here। आप उस साइट पर किसी भी jQuery विधि के कार्यान्वयन की जांच कर सकते हैं।

निम्नलिखित कोड स्निपेट में मैंने //LOOK HERE टिप्पणी के साथ महत्वपूर्ण पंक्ति को एनोटेट किया है।

show विधि का महत्वपूर्ण हिस्सा:

for (i = 0; i < j; i++) { 
    elem = this[i]; 

    if (elem.style) { 
     display = elem.style.display; 

     if (display === "" || display === "none") { 
      elem.style.display = jQuery._data(elem, "olddisplay") || ""; //LOOK HERE 
     } 
    } 
} 

hiding an element यह सबसे पहले एक data विशेषता में वर्तमान display मूल्य संग्रहीत करता है जब:

for (var i = 0, j = this.length; i < j; i++) { 
    if (this[i].style) { 
     var display = jQuery.css(this[i], "display"); 

     if (display !== "none" && !jQuery._data(this[i], "olddisplay")) { 
      jQuery._data(this[i], "olddisplay", display); //LOOK HERE 
     } 
    } 
} 

और फिर बस none करने के लिए display संपत्ति सेट। महत्वपूर्ण हिस्सा:

for (i = 0; i < j; i++) { 
    if (this[i].style) { 
     this[i].style.display = "none"; //LOOK HERE 
    } 
} 

नोट

ऊपर कोड jQuery संस्करण 1.6.2 से लिया और स्पष्ट रूप से बाद के संस्करणों में परिवर्तन के अधीन है है।