जांच करें कि चेकबॉक्स पहले से jQuery

Question

का उपयोग कर लोड पर चेक किया गया है मैं वर्तमान में

$("#some-box").click(function(){ 
    $("#main-box").toggle(); 
    }); 

कौन सा अच्छी तरह से काम करता है, जब चेकबॉक्स एक पृष्ठ है कि चेक बॉक्स स्थिति बचाता है का हिस्सा है के अलावा उपयोग कर रहा हूँ। यदि चेकबॉक्स को चेक के रूप में सहेजा जाता है, तो मुख्य बॉक्स (जिसे चेकबॉक्स पर क्लिक किया जाता है) प्रकट होता है, फिर से लोड होने पर छिपा हुआ होता है, और केवल चेकबॉक्स पर क्लिक होने पर ही दिखाई देता है, जिसका अर्थ अब "अनचाहे" चेकबॉक्स होगा (जैसा कि अपेक्षित है टॉगल)।

यदि चेकबॉक्स पहले से ही टिके हुए हैं, तो मैं पेज लोड पर कैसे जांच सकता हूं, किस स्थिति में स्वचालित रूप से टॉगल ट्रिगर करना है?

Answer 1

इस काम करना चाहिए:

if ($("#some-box").is(':checked')){ 
    $("#main-box").show(); 
} 

Answer 2

उपयोग is(':checked') परीक्षण करने के लिए और बॉक्स दिखाई देते हैं यदि चेकबॉक्स चेक किया जाता है:

if ($('#some-box').is(':checked')) { 
    $('#main-box').show(); 
} 

और फिर अपने क्लिक हैंडलर का उपयोग के रूप में है।

Answer 3

आप प्रारंभिक स्थिति .attr("checked") या .prop("defaultChecked") के साथ प्राप्त कर सकते हैं। और हम क्लिक करने के लिए नहीं करना चाहते हैं (परिवर्तन -

function update() { 
    $("#main-box")[this.checked ? "hide" : "show"](); 
    // as by @zerkms, this is a different way for writing it: 
    // $("#main-box").toggle(this.checked); 
} 
update.call($("#some-box").click(update)[0]); 

यह आसान है सबसे घटनाओं के लिए सिर्फ initialisation के लिए एक बार यह गति प्रदान करने, लेकिन वह यहां लागू नहीं होता है: हालांकि, मुझे लगता है कि निम्नलिखित एक बेहतर तरीका है) चेकबॉक्स स्वचालित रूप से अधिभार।

Answer 4

.toggle() राज्य को स्वीकार करता है - तो आप को दिखाना है या पास या किसी विशेष कॉल पर एक तत्व को छिपाने सकता है:

$("#some-box").change(function(){ 
    $("#main-box").toggle($(this).is(':checked')); 
    }); 

$('#some-box').trigger('change'); 

पुनश्च: जैसा कि आप देख सकते हैं मैं click

के बजाय change घटना का उपयोग करने का प्रस्ताव कर रहा हूँ

ऑनलाइन डेमो: http://jsfiddle.net/R4Bjw/

Answer 5

(function($) { 
    var $somebox = $('#some-box'), 
     $mainbox = $('#main-box'); 

    var toggleMain = function() { 
     $mainbox.slideToggle(); 
    }; 

    if($somebox.is(':checked')) { 
     toggleMain(); 
    } 

    $somebox.on('click', toggleMain); 
})(window.jQuery); 

यहाँ एक बेला है: http://jsfiddle.net/FX7Du/4/