I can not hide div with jQuery

Question

I can not hide div with jQuery

Navigation

#1 by (1 votes)
#2 by (1 votes)

0

I do not get that by clicking on a label , through jQuery a div disappears. I am the part of HTML is this:

$(document).ready(main);

function main(){

$('#label_cookies').click(function(){
    document.getElementById('caja_cookies').style.display='none';
});
}

<div id="caja_cookies">
  <p>Utilizamos "cookies" para ofrecerte una mejor experiencia de servicio. Al navegar o utilizar nuestros servicios, aceptas el uso que hacemos de las "cookies".</p>
  <div style="width:auto;margin-top:10px;">
    <input type="checkbox" name="checkbox" id="cookies_aceptar" value="value">
    <label id="label_cookies" for="cookies_aceptar">Aceptar</label>
    <a href="#">Más información</a>
  </div>

</div>

jquery

asked by JetLagFox 14.10.2017 в 19:21

source

2 answers

1

Your code is fine, maybe you just need to include the jQuery library (check which version you want to use):

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

Here the code working:

$(document).ready(main);

function main(){
  $('#label_cookies').click(function(){
      document.getElementById('caja_cookies').style.display='none';
  });
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div id="caja_cookies">
  <p>Utilizamos "cookies" para ofrecerte una mejor experiencia de servicio. Al navegar o utilizar nuestros servicios, aceptas el uso que hacemos de las "cookies".</p>
  <div style="width:auto;margin-top:10px;">
    <input type="checkbox" name="checkbox" id="cookies_aceptar" value="value">
    <label id="label_cookies" for="cookies_aceptar">Aceptar</label>
    <a href="#">Más información</a>
  </div>
</div>

answered by 14.10.2017 в 20:12

How can I upload a .jsp file in Tomcat 8? Syntax of a wrong PHP fix

score 1 · Accepted Answer

do not do that

$('#label_cookies').click(function(){
document.getElementById('caja_cookies').style.display='none';

});

treat this

    $('#label_cookies').click(function(){
$(#caja_cookies).hide(600);
});

the number 600 gives the effect of hidden slow
hide is the function hidden in jquery

you can also do it with javascript

  function ocultar(){
      $(#caja_cookies).hide(600);
}

to the form add a onclick='ocultar()' that is the function call to shoot the hidden

    <div id="caja_cookies">
  <p>Utilizamos "cookies" para ofrecerte una mejor experiencia de servicio. Al navegar o utilizar nuestros servicios, aceptas el uso que hacemos de las "cookies".</p>

function ocultar(){
  $('#ocultardiv').hide(600);
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id='ocultardiv'>
     <div style="width:auto;margin-top:10px;">
        <input type="checkbox" name="checkbox" id="cookies_aceptar" value="value" onclick='ocultar()'>
        <label id="label_cookies" for="cookies_aceptar" >Aceptar</label>
        <a href="#">Más información</a>
      </div>

</div>

Here I leave you already working the example