Je souhaite que le deuxième événement de clic de bouton fonctionne uniquement après le fonctionnement du premier événement de clic de bouton. L'événement de clic du deuxième bouton ne doit pas fonctionner avant de cliquer sur le premier bouton.

 <div class = "panel1">
 <button>button1</button>
 <p>Button 1 triggered</p>
</div>
<div class = "panel2">
<button>button1</button>
<p>Button 2 triggered</p>
</div>

 p{
 display:none;
} 


  $(document).ready(function(){
    $("button").click(function(){
    $(this).siblings("p").toggle();
      });
     })

Lien JSFiddle

-1
Gautham 24 janv. 2017 à 12:31

6 réponses

Meilleure réponse

Veuillez trouver la solution ci-dessous:

https://jsfiddle.net/q8cyd2mr/6/

Partie HTML:

<div class = "panel1">
      <button>button1</button>
      <p>Button 1 triggered</p>
    </div>
    <div class = "panel2">
      <button>button2</button>
      <p>Button 2 triggered</p>
</div>

Partie JS:

$(document).ready(function(){
    $(".panel2 button").prop('disabled', true);
    $("button").click(function(){
        $(this).siblings("p").toggle();
        if($(this).parent().prop("class")=='panel1'){
          $(".panel2 button").prop('disabled', false);
        }
    });
});
0
VIPIN A ROY 24 janv. 2017 à 10:39
$(".firstbutton").on("click", function(evt){
// custon script 
   $("#secondbutton").trigger("click");
 });
0
pala vamsi 24 janv. 2017 à 09:35

Je commencerais par désactiver le deuxième bouton par défaut. Puis activez-le après que l'utilisateur a cliqué sur le premier bouton. Je vous ai fourni un code de ce à quoi cela ressemblerait, j'espère que cela vous aidera.

HTML:

<div class = "panel1">
    <button>button1</button>
    <p>Button 1 triggered</p>
</div>
<div class = "panel2">
    <button disabled>button1</button>
    <p>Button 2 triggered</p>
</div>

CSS:

p{
    display: none;
} 

Javascript:

$(document).ready(function(){
  $(".panel1 button").click(function(){
      $(this).siblings("p").toggle();
      $(".panel2 button").prop("disabled", false);
  });
  $(".panel2 button").click(function(){
      $(this).siblings("p").toggle();
  });
})
1
Reality-Torrent 24 janv. 2017 à 12:21

Vous pourriez résoudre votre problème avec la propriété handicapée.

$(document).ready(function() {
    $(button2).prop('disabled', true);
    $(button1).click(function() {
        $(button2).prop('disabled', false);
    });
});
0
Patrick Vogt 24 janv. 2017 à 09:33

Oui, vous pouvez faire fonctionner le deuxième événement de clic de bouton uniquement après le premier événement de clic de bouton comme ceci:

$(document).ready(function(){
    $(".panel1 button").click(function(){
        $(this).siblings("p").toggle();
        $(".panel2 button").click(function(){
          $(this).siblings("p").toggle();
        });
    });
})
0
Mukesh Ram 24 janv. 2017 à 09:39

En plus de deux de ces méthodes, vous pouvez conserver une variable booléenne et vérifier si elle est vraie avant d'exécuter la deuxième méthode.Après avoir exécuté, rendez-la à nouveau faux.et activez-la dans les premiers boutons, cliquez sur la méthode d'événement Une meilleure pratique consiste à désactiver cependant

-1
xelvias.exe 24 janv. 2017 à 09:44