How to put two functions in onclick for one to be done if the other works

Asked

Viewed 90 times

-2

I’m learning Java and I had a question, when I put:

<button onclick=  "this. innerHTML =  prompt('Qual o nome do botão?'); ">qual o nome do botão</button>

I can change the name of the button, so I wanted that when I put to the button call: Exit the page, that same button receive another function, which is to return the previous page. I wanted to know if there’s a way and if there is, how could I?

javascript

  • how about something like onclick="if (function1()) function2();? of course the first Function must return true/false

  • 2

    To perform a function after exiting the page, you can trigger the Unload event on this page: window.addEventListener('unload', suaFuncaoDeRetorno). Within that function: suaFuncaoDeRetorno can put type history.back(0); or the address you were wanting to call, or even lock the exit...

3 answers

1

In modern browsers register one or more of a listeners of events with Element.addEventListener().
If multiple event listeners are attached to the same element for the same type of event, they will be called in the order in which they were added.

To prevent other listeners of the same event from using Event.stopImmediatePropagation().

const btn = document.getElementById("btn");

btn.addEventListener("click", function(evt) {
  const nome = (prompt('Qual o nome do botão?') ?? "qual o nome do botão").toLowerCase();
  if (nome == "sair da página") {
    console.log("Saindo da página....");
    return;
  } 
  evt.target.innerText = nome;
  evt.stopImmediatePropagation();            //Evita que os outros ouvintes do evento click sejam acionados.
});

btn.addEventListener("click", function(evt) {
  console.log("...chamando o método para deixar a página");
  window.history.back();                     //Não funciona no sandbox.
});
<button id="btn">qual o nome do botão</button>

The same task, without resorting to a queue of events:

const btn = document.getElementById("btn");

btn.addEventListener("click", function(evt) {
  const nome = (prompt('Qual o nome do botão?') ?? "qual o nome do botão").toLowerCase();
  if (nome == "sair da página") {
    console.log("Saindo da página....");
    window.history.back();                    //Não funciona no sandbox.
    return;
  } 
  evt.target.innerText = nome;
});
<button id="btn">qual o nome do botão</button>

0

If I understand correctly, you want to create a title that would be the action of the button and then run it:

<button onclick="executeButton(this)">qual o nome do botão</button>
<script>
function executeButton(el) {
   var p = prompt('qual o nome do botão?');
   if (p != 'Sair da página') {
      el.innerHTML = p;
   } else {
     window.location = '/sair.html'
   }

}
</script>

Here the fiddle of the example.

-1

Hello, a simple way to do this is by capsuling your functions into a third: EX: JS:

    const funcao1 = (event) => {...}
    const funcao2 = (event) => {...}
    const funcaoEmcapsulada = (event) => {
       funcao1(event);
       funcao2(event);
    }

HTML:

    <button onclick="funcaoEmcapsulada">qual o nome do botão</button>

Browser other questions tagged javascript

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