jQuery scorciatoie/tecnica per alternare le classi

Question

In jQuery, c'è un altro modo per scrivere questo?

Versione 1

 $("#date_filter-enable").click(function() { 

     $("#search_dates").removeClass("hidden"); 
    }); 

    $("#date_filter-disable").click(function() { 

     $("#search_dates").addClass("hidden"); 
    }); 

Versione 2

 $("input[id^=date_filter-]").click(function(e) { 

     var clicked = $(e.target); 
     var id = clicked.attr("id").split("-"); 
     var action = id[1]; 

     if(action == "enable") 
     $("#search_dates").removeClass("hidden"); 
     else 
     $("#search_dates").addClass("hidden"); 
    }); 

io sono abituato a codifica come questo ... ma voglio sapere se ci sono molto più leggibili, modo efficace, fresco di scrittura è ... come attivare, concatenare ... migliori pratiche che non conosco ^^

Apprezzo che tu lo abbia condiviso! ^^

Answer 1

È necessario utilizzare il metodo toggleClass.

$("input[id^=date_filter-]").click(function(e) { 
    $("#search_dates").toggleClass("hidden"); 
}); 

Answer 2

$("input[id^=date_filter-]").click(function(e) { 
     if($(this).attr("id").split("-")[1] == "enable") 
     $("#search_dates").removeClass("hidden"); 
     else 
     $("#search_dates").addClass("hidden"); 
    });