Perform a single click onclick

Question

Perform a single click onclick

Navigation

#1 by (0 votes)

0

Good afternoon, how to trigger the method with a click on TR?

follow code

<script> 
function exibe(id) {  
    var display = document.getElementById(id).style.display;
    if( display === "none") {  
        document.getElementById(id).style.display = "inline";  
    } else {  
        document.getElementById(id).style.display = "none";  
    }     
}
</script>

<h1 class="musc"> Músculos </h1>
<table id="musc">
    <tr onclick="exibe('localdador');"> 
        <td class="ce"> 
            <input type="radio" name="tMusculos" id="c17" value="Imagem 1" onClick="mudarimagem(1)"> 
        </td> 
        <td class="cd"> 
            <label for="c17"> Anterior </label> 
        </td> 
   </tr> 
</table>

javascript

asked by anonymous 22.11.2017 / 15:18

1 answer

get the logged in user and save the id using inline formset Function that turns the date into Brazilian and American format? [duplicate]

score 0 · Accepted Answer

In this case, marking input radio , of course, you are clicking on the tr that contains input and consequently the two functions will be executed, but the reciprocal is not true, that is, when clicking on tr only the function inherent to tr will be triggered. See the following example:

function mudarimagem(i) {    
    if (i == 1) {
        document.getElementById("imagem").src="https://i.stack.imgur.com/1IncM.jpg";}else{document.getElementById("imagem").src="https://i.stack.imgur.com/Rj325.jpg";}}functionexibe(id){vardisplay=document.getElementById('id').style.display;if(display==="none") {  
      document.getElementById('id').style.display = "inline";  
   } else {  
      document.getElementById('id').style.display = "none";  
   }     
}

<h1 id="id" class="musc"> Músculos </h1>   
   <table id="musc" border="0" width="200" bgcolor="#C0C0C0" height="100" style="border-collapse: collapse">
      <tr onclick="exibe('localdador');"> 
         <td class="ce"> <input type="radio" name="tMusculos" id="c17" value="Imagem 1" onclick="mudarimagem(1);"> </td> 
         <td class="cd"> <label for="c17"> Anterior </label> </td> 
      </tr> 
  </table>
  
  <img id="imagem" src="https://i.stack.imgur.com/Rj325.jpg">

Thereareafewwaystoperformbothfunctionswithjustoneclick.

Callafunctionwithintheotherfunction,sowhencallingoneautomatically,youwillcallanother.

functiondisplays(id){
change(1);

Example:

function mudarimagem(i) {    
	if (i == 1) {
        document.getElementById("imagem").src="https://i.stack.imgur.com/1IncM.jpg";}else{document.getElementById("imagem").src="https://i.stack.imgur.com/Rj325.jpg";}}functionexibe(id){mudarimagem(1);vardisplay=document.getElementById('id').style.display;if(display==="none") {  
      document.getElementById('id').style.display = "inline";  
   }    
    else {  
      document.getElementById('id').style.display = "none";  
   }     
}

<h1 id="id" class="musc"> Músculos </h1>   
   <table id="musc" border="0" width="200" bgcolor="#C0C0C0" height="100" style="border-collapse: collapse">
      <tr onclick="exibe('localdador');"> 
         <td class="ce"> <input type="radio" name="tMusculos" id="c17" value="Imagem 1"> </td> 
         <td class="cd"> <label for="c17"> Anterior </label> </td> 
      </tr> 
  </table>
  
  <img id="imagem" src="https://i.stack.imgur.com/Rj325.jpg">

Anotherwaywouldbetoseparatethefunctionsby;(dotandcomma)inasingleeventonclick:<tronclick="exibe('localdador'); mudarimagem(1);">

Another solution would be to pass a function that calls both:

<tr onclick="executar();">

and

function executar(){
    exibe('localdador');
    mudarimagem(1);
}