Good day! Jquery if the checkbox is checked, then you need to hide the listbox with a background if the user ticked the checkbox, then the form is hidden, if removed, it appears how to make a prompt, without pressing any buttons, just checkout

I did it like this, but this is for handling the loading of the page and something does not work anyway

<script> $(function(){ $(document).ready(function() { if ($("#h_check").is(":checked")) { document.getElementById('m_elements').style.display = 'none'; } </script>
  • Because it is some random code unfinished? - Qwertiy ♦

2 answers 2

The bottom line is that your code only works when you start the page, and you need it to work after each click on the checkbox :

 $('#h_check').click(function() { if($(this).prop('checked')) { $('#m_elements').css('display', 'none'); }else{ $('#m_elements').css('display', 'block'); } }); 
 #m_elements { display: block; height: 100vh; background: grey; } 
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <input type="checkbox" id="h_check"> <div id="m_elements"></div>

    You do not have a click handler (state change) by checkbox + confusion with brackets. At the moment you check the checked state when loading. If it is in this state, the condition is triggered.

    You can use .change () :

     $('#h_check').change(function() { if (this.checked) { $('#m_elements').hide(); } else { $('#m_elements').show(); } }); 
     .block { height: 150px; background: red; } 
     <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script> <input type="checkbox" id="h_check"> Чек <div id="m_elements" class="block"></div>

    • Your option is more concise - Yuri
    • and what will be bad toggle? - And
    • @And Nothing will be bad. Possible without condition, just $('#m_elements').toggle(); in change() put. - Alexander Igorevich