У меня следующий выпадающий список:
<button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
Seleccionar <span class="caret"></span>
</button>
<ul class="dropdown-menu" role="menu" >
<li><a href="#" id="domicilio" data-value="acasa-viajar">A domicilio / En mi lugar</a></li>
<li><a href="#" id="domicilio1" data-value="viajar">Sólo a domicilio</a></li>
<li><a href="#" id="noDomicilio" data-value="acasa">Sólo en mi lugar</a></li>
</ul>
И мне это нужно, когда я выбираю Option A domicilio/En mi lugar или Sólo domicilio, он выполняет это действие:
$("#provincias").removeClass('collapse');
Я решил это, но я уверен, что этот код не очень хорошо.
$('#domicilio').click(function(e) {
$("#provincias").removeClass('collapse');
e.preventDefault();// prevent the default anchor functionality
});
$('#domicilio1').click(function(e) {
$("#provincias").removeClass('collapse');
e.preventDefault();// prevent the default anchor functionality
});
$('#noDomicilio').click(function(e) {
$("#provincias").addClass('collapse');
e.preventDefault();// prevent the default anchor functionality
});
спасибо
Что-то вроде следующего должно работать, чтобы инкапсулировать его в одну функцию (вы также можете добавить идентификатор в оператор select, если у вас более одного с данным классом):
$('.dropdown-menu li a').on('click',function(){
switch($(this).attr('id')){
case 'domicilio':
//execute your code;
$('#provincias').removeClass('collapse');
break;
case 'domicilio1':
//execute your code;
$('#provincias').removeClass('collapse');
break;
case 'noDomicilio':
//execute your code;
$('#provincias').addClass('collapse');
break;
}
e.preventDefaults();
});
Отредактировано с учетом UL не SELECT
Нет необходимости добавлять/удалять класс и не нужно менять свой HTML-код.
$('.dropdown-menu li a').on('click', function(e) {
if ( $(this).attr('id') == 'noDomicilio' )
$('#provincias').addClass('collapse');
else
$('#provincias').removeClass('collapse');
e.preventDefault();
});
Добавьте класс в теги.
$('.foo').on('click', function(e) {
if ( $(this).attr('id') == 'noDomicilio' )
$('#provincias').addClass('collapse');
else
$('#provincias').removeClass('collapse');
e.preventDefault();
});