Perform two functions with onclick

Asked

Viewed 3,208 times

2

I need to perform two functions with onClick, but I’m not succeeding, could someone help me? I want to hide the father div "introductionAds" and show the div "showID"

function ocultar(ocultarID){
    document.getElementById(ocultarID).style.display='none';
}
function mostrar(mostrarID){
    document.getElementById(mostrarID).style.display='block';
}
.disabled {
  text-decoration: none;
  color: gray;
  cursor: default;
}
<div id='introductionAds'>
  <ul>
    <li><a href="" target='_blank' class='' id="link1"> Link habilitado </a></li>
    <li><a href="" target='_blank' class='disabled' id="link2"> Link habilitado </a></li>
    <li><a href="" target='_blank' class='disabled' id="link3"> Link habilitado </a></li>
    <li><a href="" target='_blank' class='disabled' id="link4"> Link habilitado </a></li>
    <li><a href="" target='_blank' class='disabled' id="link5" onclick="this.onclick=function(){mostrar('mostrarID');ocultar('introductionAds');}"> Link habilitado </a></li>
  </ul>
  <div>

<div id='mostrarID' style='display:none;'>aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</div>

3 answers

2

Add point and comma at the end to call the functions, (will be called in order)

 <input id="botao" type="button" value="click" onclick="ocultarID(); mostrarID();"/>
  • William this was my first attempt and as incredible as it seems it doesn’t work, but realize that I want to run the function on a link and not on a button. For you to have an idea try to put my script in an editor and run it for you see, not funfiona like this, at least should.

1

Dude, if I get it right, you’re gonna hide one and show the other at the same time. So you can put it all in one function. It would look like this:

function mostrar (){
  document.getElementById('mostrarID').style.display = 'block';
  document.getElementById('introductionAds').style.display = 'none';
}

And you don’t need to pass anything as a parameter, JS looks for the id in HTML. Try this way, if that’s not what you want, just warn.

  • Junior has also tried this and only hides the div introductionAds but does not show the div show ID. Just to be sure I just tried it there again but nothing yet. I don’t understand why it’s not working.

0

You can also transcribe this function into one:

function mostrar(id, show){
    var show = (show) ? 'block' : 'none';
    document.getElementById(id).style.display=show;
}

mostrar('introductionAds', true);
mostrar('introductionAds', false);
  • Guilherme just tested here and also does not work see the link below:

  • Also failed, check out http://jsfiddle.net/p3Bht/74/

Browser other questions tagged

You are not signed in. Login or sign up in order to post.