क्या jQuery.toggle (बूलियन) की तरह कुछ मौजूद है?

Question

मैं निम्नलिखित कोड के समान कुछ लिखता हूं। यह मूल रूप से कुछ स्थितियों के आधार पर तत्व को टॉगल करता है।

निम्नलिखित निर्मित उदाहरण में, स्थिति "अगर agree चेकबॉक्स चेक किया गया है और name फ़ील्ड खाली नहीं है"।

$("button").click(function() { 
    if ($("#agree").is(":checked") && $("#name").val() != "") { 
    $("#mydiv").show(); 
    } else { 
    $("#mydiv").hide(); 
    } 
}); 

मेरी इच्छा है कि कुछ प्रकार का jQuery फ़ंक्शन ऐसा होगा जो इस तरह काम करेगा।

$("button").click(function() { 
    var condition = $("#agree").is(":checked") && $("#name").val() != ""); 
    $("#mydiv").toggle(condition); 
}); 

क्या वहां ऐसा कुछ है? या कम if-else-ish रास्ते में ऐसा करने के पहले उदाहरण के अलावा अन्य तरीके हैं?

Answer 1

ठीक है, तो मैं एक बेवकूफ हूँ और प्रश्न पूछने से पहले आरटीएम की जरूरत है।

jQuery.toggle() आपको यह बॉक्स से बाहर करने की अनुमति देता है।

$("button").click(function() { 
    var condition = $("#agree").is(":checked") && $("#name").val() != ""); 
    $("#mydiv").toggle(condition); 
}); 

Answer 2

आप स्वयं फ़ंक्शन लिख सकते हैं।

function toggleIf(element, condition) { 
    if (condition) { element.show(); } 
    else { element.hide(); } 
} 

तो इस तरह इसका इस्तेमाल:

toggleIf($("button"), $("#agree").is(":checked") && $("#name").val() != ""); 

Answer 3

पहले नहीं, देखें अगर मैं समझता हूँ कि क्या आप सही तरीके से करना चाहता हूँ ... आप एक चेकबॉक्स के राज्य को देखने के लिए चाहते हैं (चेक या नहीं) और उस मूल्य की स्थिति के आधार पर एक दूसरा div छुपाएं या दिखाएं।

.noDisplay { 
    display:none; 
} 

उपयोग इस जावास्क्रिप्ट:

इस शैली को परिभाषित करें

$("button").click(function() { 
    $("#mydiv").toggleClass("noDisplay", $("#name").val() == ""); 
}); 

उस पर jQuery से प्रलेखन यहां पाया जा सकता है: http://api.jquery.com/toggleClass/

Answer 4

तो toggle() आप (उदाहरण के लिए, क्योंकि यह एनिमेट), यदि आप एक छोटे jQuery प्लगइन, इस प्रकार लिख सकते हैं के लिए अच्छा नहीं है:

$.fn.toggleIf = function(showOrHide) { 
    return this.each(function() { 
    if (showOrHide) { 
     return $(this).show(); 
    } else { 
     return $(this).hide(); 
    } 
    }); 
}; 

और उसके बाद इस तरह इसका इस्तेमाल:

$(element).toggleIf(condition);