Registrazione jQuery click, primo e secondo scatto

Question

c'è un modo per eseguire due funzioni simili a questo:

$('.myClass').click(
    function() { 
     // First click 
    }, 
    function() { 
     // Second click 
    } 
); 

voglio usare un evento semplice ginocchiera, ma .toggle() è stato sconsigliato.

Answer 1

Prova questo:

$('.myClass').click(function() { 
    var clicks = $(this).data('clicks'); 
    if (clicks) { 
    // odd clicks 
    } else { 
    // even clicks 
    } 
    $(this).data("clicks", !clicks); 
}); 

Questo si basa su una questione già risposto: Alternative to jQuery's .toggle() method that supports eventData?

Answer 2

O questo:

var clicks = 0; 

$('.myClass').click(function() { 
    if (clicks == 0){ 
     // first click 
    } else{ 
     // second click 
    } 
    ++clicks; 
}); 

Answer 3

non so quello che stai tryin di fare, ma possiamo ottenere l'interruttore di base da

$('.myClass').click({ 
    var $this=$(this);   
    if($this.is(':hidden')) 
    { 
     $this.show('slow'); 
    }else{ 
     $this.hide('slow'); 
    } 
}) 

nota: questo funziona per l'evento click senza fine per l'elemento .. non solo per due clic (se questo è ciò che si vuole)

oppure è possibile utilizzare classe CSS per nascondere/mostrare il div e utilizzare jquery.toggleClass()

Answer 4

questo ho lavorato per il mio menu

var SubMenuH = $('.subBoxHederMenu').height(); 
var clicks = 0; 

     $('.btn-menu').click(function(){ 
      if(clicks == 0){ 
      $('.headerMenu').animate({height:SubMenuH}); 
      clicks++; 
      console.log("abierto"); 
      }else{ 
      $('.headerMenu').animate({height:"55px"}); 
      clicks--; 
      console.log("cerrado"); 
      } 
      console.log(clicks); 
     }); 

Answer 5

  var click_s=0; 
      $('#show_pass').click(function(){ 
       if(click_s % 2 == 0){ 
        $('#pwd').attr('type','text'); 
        $(this).html('Hide'); 
       } 
       else{ 
        $('#pwd').attr('type','password'); 
        $(this).html('Show'); 
       } 
       click_s++; 
      }); 

Answer 6

Nel metodo indicato di seguito Stiamo passando una serie di funzioni per la nostra funzione personalizzata .toggleClick(). E stiamo usando l'attributo data-* di HTML5 per memorizzare l'indice della funzione che verrà eseguita nella successiva iterazione del processo di gestione degli eventi dei clic. Questo valore, memorizzato nella proprietà data-index, viene aggiornato in ogni iterazione in modo da poter tracciare l'indice della funzione da eseguire nella successiva iterazione.

Tutte queste funzioni verranno eseguite una alla volta in ogni iterazione dell'evento click. Ad esempio nella prima funzione di iterazione a index[0] verrà eseguita, nella seconda funzione di iterazione memorizzata in index[1] verrà eseguita e così via.

Nel caso si possono passare solo 2 funzioni a questo array. Ma questo metodo non è limitato a sole 2 funzioni. È possibile passare 3, 4, 5 o più funzioni in questo array e verranno eseguite senza apportare modifiche al codice.

L'esempio nel frammento seguente sta gestendo quattro funzioni. È possibile passare le funzioni in base alle proprie esigenze.

$.fn.toggleClick = function(funcArray) { 
 
    return this.click(function() { 
 
    var elem = $(this); 
 
    var index = elem.data('index') || 0; 
 

 
    funcArray[index](); 
 
    elem.data('index', (index + 1) % funcArray.length); 
 
    }); 
 
}; 
 

 
$('.btn').toggleClick([ 
 
    function() { 
 
    alert('From Function 1'); 
 
    }, function() { 
 
    alert('From Function 2'); 
 
    }, function() { 
 
    alert('From Function 3'); 
 
    }, function() { 
 
    alert('From Function 4'); 
 
    } 
 
]);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
 
<button type="button" class="btn">Click Me</button> 
 
<button type="button" class="btn">Click Me</button>