JQuery के साथ एक div कैसे छिपाएं?


83

जब मैं एक HTML छिपाना चाहता हूं <div>, तो मैं निम्नलिखित जावास्क्रिप्ट कोड का उपयोग करता हूं:

var div = document.getElementById('myDiv');
div.style.visibility = "hidden";
div.style.display = "none";

JQuery में उस कोड के बराबर क्या है?

जवाबों:


154
$('#myDiv').hide();

या

$('#myDiv').slideUp();

या

$('#myDiv').fadeOut();

यह वास्तव में display:noneतीन अलग एनीमेशन प्रभाव के साथ सभी तीन एक ही है। सही उत्तर @ honk31 द्वारा है .css("visibility", "hidden")और एक उद्देश्य है! इसके visiblity:hiddenविपरीत display:noneअंतरिक्ष का उपयोग करता रहता है जबकि display:noneयह व्यवहार करेगा कि यह वहां कभी मौजूद नहीं है।
डेवलपर

1
@Developer एक दिलचस्प और संभावित रूप से उपयोगी बिंदु है, लेकिन मुझे लगता है कि आपके समाधान को इंगित करने के लिए बिल्कुल कुछ भी वांछित प्रभाव नहीं था। इसके विपरीत, ऐसा प्रतीत होता है कि ओपी ने पाया कि उनके प्रश्न का उत्तर काफी अच्छी तरह से दिया गया है। साथ ही मेरे उद्देश्यों के लिए, अंतरिक्ष को जारी रखना वास्तव में बहुत अवांछनीय होगा। अभिमानी मत बनो।
donutguy640

जैसे हम RTFM से पहले कहते थे। प्रारंभिक पोस्ट में, एक व्यक्ति पूछता है कि दृश्यता = "छिपी" और प्रदर्शन = "कोई नहीं" के बीच अंतर क्या है, क्या उसने कभी पूछा कि छिपने का एनीमेशन कैसे बनाया जाए? विषय पर बने रहें!
डेवलपर


27
$("#myDiv").hide();

css डिस्प्ले को कोई नहीं पर सेट करेगा। यदि आपको दृश्यता को छिपी के साथ सेट करने की आवश्यकता है, तो ऐसा कर सकते हैं

$("#myDiv").css("visibility", "hidden");

या दोनों को एक श्रृंखला में संयोजित करें

$("#myDiv").hide().css("visibility", "hidden");

या एक सीएसएस () फ़ंक्शन के साथ सब कुछ लिखें

$("#myDiv").css({
  display: "none",
  visibility: "hidden"
});

इस उत्तर को एक सही के रूप में चुना जाना चाहिए, मुझे नहीं पता कि लोगों ने पूरी तरह से गलत उत्तर के लिए मतदान क्यों किया!
डेवलपर

14

यदि आप चाहते हैं कि तत्व अपना स्थान बनाए रखे, तो आपको उपयोग करने की आवश्यकता है,

$('#myDiv').css('visibility','hidden')

यदि आप तत्व को अपने स्थान को बनाए रखना नहीं चाहते हैं, तो आप इसका उपयोग कर सकते हैं,

$('#myDiv').css('display','none')

या केवल,

$('#myDiv').hide();

7

$("myDiv").hide();और $("myDiv").show();इंटरनेट एक्सप्लोरर में वह अच्छी तरह से काम नहीं करता है।

जिस तरह से मैं इस के आसपास मिल गया के HTML सामग्री मिल गया था myDivका उपयोग कर .html()

मैंने तब इसे एक नए बनाए गए DIV को लिखा था। मैंने तब DIV को शरीर में जोड़ दिया और चर की सामग्री Contentको HiddenFieldतत्कालीन पढ़ने के लिए उस सामग्री से जोड़ दिया, जब मैं DIV दिखाना चाहता था।

बाद में मैंने .remove()DIV से छुटकारा पाने के लिए विधि का उपयोग किया जो अस्थायी रूप से मेरे DIVs html को पकड़े हुए था।

var Content = $('myDiv').html(); 
        $('myDiv').empty();
        var hiddenField = $("<input type='hidden' id='myDiv2'>");
        $('body').append(hiddenField);
        HiddenField.val(Content);

और फिर जब मैं सामग्री को फिर से दिखाना चाहता था।

        var Content = $('myDiv');
        Content.html($('#myDiv2').val());
        $('#myDiv2').remove();

यह अधिक विश्वसनीय था कि .hide()& .show()विधियां।



2

$('#myDiv').hide(); छिपी फ़ंक्शन का उपयोग सामग्री को संपादित करने के लिए किया जाता है और शो फ़ंक्शन का उपयोग फिर से दिखाने के लिए किया जाता है।

अधिक जानकारी के लिए कृपया इस लिंक पर क्लिक करें ।

हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.