एक बूलियन के साथ तत्व छिपाएँ / दिखाएँ


109

मैं अपने कोड में इनमें से बहुत से हैं

if(shouldElementBeVisible)
    $element.show()
else
    $element.hide()

क्या जावास्क्रिप्ट, jquery, या अंडरस्कोर के साथ कोई और अधिक सुरुचिपूर्ण तरीका है? आदर्श रूप से मैं ऐसा कुछ चाहता हूं जो ऐसा दिखता है

$element.showOrHideDependingOn(shouldElementBeVisible)


@SpencerWieczorek वह प्रश्न संदर्भ के लिए होता है toggle, लेकिन इसका एक अलग प्रश्न है
आकिल फर्नांडिस

जवाबों:


166

जाहिरा तौर पर आप सिर्फ toggleसमारोह के लिए एक बूलियन पारित कर सकते हैं

$element.toggle(shouldElementBeVisible)

34
मैं गलती से दूसरे "ओवरलोड" में से एक$element.toggle(!!shouldElementBeVisible) को रोकने के लिए उपयोग करने की सलाह देता हूं , जब तक कि आप निश्चित रूप से यह सुनिश्चित नहीं करते हैं कि चर एक ऊबड़ मूल्य है।
जेरोन

7
एक बेहतर विकल्प हो सकता है $element.toggle(shouldElementBeVisible == true)
जोक्स

"0"और वैसे भी "false"बहुत अलग व्यवहार किया जाता falseहै, इसलिए मुझे नहीं लगता कि भेद वास्तव में मायने रखता है - यहां तक 0कि गलत भी होगा यदि आप इसे छिपाना चाहते हैं, क्योंकि उन सभी एनीमेशन समय के बाद भी लेकिन फिर भी दृश्यता फ्लिप होती है।
तसाल

19

हाँ वहाँ है!

$element.toggle();

किसी भी पैरामीटर के बिना, toggleतत्वों की दृश्यता में वृद्धि होती है (मुझे visibilityसंपत्ति से मतलब नहीं है ) और तत्व की वर्तमान स्थिति पर निर्भर करता है।

$element.toggle(display);

यदि आप toggleबूलियन पैरामीटर के साथ कॉल करते हैं, तो तत्व दिखाया गया है यदि यह है trueऔर hiddenयदि यह हैfalse

स्रोत


2
मैं इस गलत को चिह्नित करने वाला था, तब मुझे महसूस हुआ कि अंतिम एपीआई संदर्भ आपको विकल्प ऑब्जेक्ट के बजाय बूलियन सेट करने की अनुमति देता है।
आकिल फर्नांडीस

उस के तहत कुछ पंक्तियाँ: "बिना किसी पैरामीटर के, .toggle () विधि बस तत्वों की दृश्यता को बढ़ाती है"
Zach Spencer

2
मैं वास्तव में जो चाहता था उसके विपरीत था। मैं चाहता था कि तत्व की वर्तमान स्थिति अप्रासंगिक हो। राज्य एक बूलियन चर पर आधारित होना चाहिए।
आकिल फर्नांडिस

@AakilFernandes तो चर दृश्यमान होने के isShownलिए प्रासंगिक $elementनहीं है या नहीं? लेकिन एक अलग चर तत्व से संबंधित नहीं है?
स्पेंसर Wieczorek

हाँ, क्षमा करें, शायद मुझे इसका नाम बदलकर isShownकुछ shouldElementBeVisibleऔर स्पष्ट करना चाहिए
आकिल फर्नांडीस

2

jQuery के पास toggle: http://api.jquery.com/toggle/

$element.toggle();

यदि यह छिपा हुआ है, तो यह तत्व दिखाएगा और यदि इसे दिखाया गया है, तो इसे छिपाएं।


0

फ़ंक्शन तत्व का .toggle()परिवर्तन करता displayहै।

यदि आप बदलना चाहते हैं visibility, तो इसके बजाय, मैं आपको ?:ऑपरेटर का उपयोग करने का सुझाव दूंगा। इसके लिए, अपने सीएसएस पर, दृश्यता को मूल स्थिति में सेट करें, और जेएस में बस डालें:

    var checkboxChecked = $("#yourCheckbox").(":checked");

    $("#yourElement").css("visibility", checkboxChecked ? "visible" : "hidden");
हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.