Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to apply checkbox with functions in javascript?

How to apply checkbox with functions in javascript?

How to hide post/object with specific tags when checkbox is unchecked?

I just need to know how to put functions for the checkbox to be automatically check upon opening the page and the checkbox to hide posts/objects with a specific tag on them. Is it correct to apply--

display:none

or--

 .structural {
 position:absolute;
 left:-9999px;
 }

--that I've found during research?

This was as far as I could go considering my lack of skills:

<input 
  type="checkbox"
  name="mycheckbox"
  value="yes" 
  onclick="  CheckboxChecked(this.checked,'checkboxdiv')"  
</div>
</div>

<script type="text/javascript">
 CheckboxChecked(document.myform.mycheckbox.checked,'checkboxdiv');
</script>
like image 506
naddy x Avatar asked Mar 24 '26 02:03

naddy x


1 Answers

If I understood your question correctly, you are attempting to hide/show a group of elements when a checkbox is checked/unchecked. This should be enough to get you going:

http://jsfiddle.net/HsCVq/

HTML:

<div class="hideWhenChecked">hide text</div>
<div>dont hide text</div>
<div class="hideWhenChecked">hide text</div>
<div>dont hide text</div>
<br />
<input type="checkbox" id="myCheckBox" />

JavaScript:​

document.getElementById('myCheckBox').addEventListener('click', function () {
    var checked = this.checked;
    var elementsToHide = document.getElementsByClassName('hideWhenChecked');

    if (checked) {
        // hide each element
    } else {
        // show each element
    }
});​

I'd suggest looking into a javascript framework such as jQuery to make this code a lot simpler.

like image 56
jbabey Avatar answered Mar 25 '26 15:03

jbabey



Donate For Us

If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!