Wie wird nur eine Dropdown-Liste erstellt, die beim Klick wieder gelöscht wird?

Question

Ich habe drei Dropdown-Listen in der horizontalen, die die Stationsnamen zeigen, wenn Sie auf eine bestimmte Zeile klicken.

Wenn ich jedoch auf eine Zeile klicke, werden alle Listen gelöscht. Eigentlich möchte ich nur bestimmte Liste zu löschen, und andere, bis der Benutzer klickt auf sie gestoppt werden.

Wie dies zu erreichen?

für meine JS-Listen hier fallen:

;(function($) { 
/* выбор города */ 
$('.lines_list').click(function(){ 
$(".stations_list").slideToggle('fast'); 
}); 
})(jQuery); 

Live-Demo ist hier: https://www.metroguides.net/ru/cities/kazan-metro

Vielen Dank im Voraus.

Answer 1

Sie setzen den Event-Handler auf alle drei Dropdown-Menüs. Wenn du einen klickst, sagst du jedem ".stations_list" slideToggle.

Probieren Sie den folgenden Code aus. Hier sollte nur das Element slideToggle geklickt werden, das mit $(this) geklickt wurde.

;(function($) { 
/* выбор города */ 
$('.lines_list').click(function(){ 
$(this).find(".stations_list").slideToggle('fast'); 
}); 
$('ul.stations_list li').click(function(){ 
var tx = $(this).html(); 
var tv = $(this).attr('alt'); 
$(this).parent().slideUp('fast'); 
$(".lines_list span").html(tx); 
$(".lines_text").html(tv); 
}); 
})(jQuery);