Я не могу шов, чтобы остановить распространение сигнала щелчка на родительский элемент. У меня есть поиск и просмотр многих вопросов здесь, но я не мог найти решение, которое работает. Я тестирую в Firefox.
//this is simply a div element
$("#" + self.id).css({
"position" : "absolute"
});
$("#" + self.id ).append(
'<div class="onoffswitch" id="'+ self.id + "_checkbox_d" + '">'+
'<input type="checkbox" name="onoffswitch" class="onoffswitch-checkbox" id="'+ self.id + "_checkbox" +
( self.isOn ? '" checked>' : '">' ) +
'<label class="onoffswitch-label" for="'+ self.id + "_checkbox" + '">'+
'<div class="onoffswitch-inner"></div>'+
'<div id="switch-mod' + self.id + '" class="onoffswitch-switch onoffswitch-switchon"></div>'+
'</label>'+
'</div>' );
$( "#" + self.id + "_checkbox_d" ).css({
"position" : "absolute"
});
$('#' + self.id + "_checkbox").click( function( event ){
if ($(this).is(':checked')) {
$( "#switch-mod" + self.id ).removeClass( "onoffswitch-switchoff" );
$( "#switch-mod" + self.id ).addClass( "onoffswitch-switchon" );
}
else{
$( "#switch-mod" + self.id ).removeClass( "onoffswitch-switchon" );
$( "#switch-mod" + self.id ).addClass( "onoffswitch-switchoff" );
}
event.stopPropagation();
event.stopImmediatePropagation();
});
$("#" + self.id ).click( function() {
$('html').trigger( "selection-panel-clicked", self.id );
});
Последний обработчик клика для родительского элемента называется, который мне нужно предотвратить.
ИЗМЕНИТЬ 1:
Я думаю, что проблема должна быть связана с css для переключателя checkbox/toggle. Я автоматически создал его здесь, http://proto.io/freebies/onoff/.
Я обнаружил, что сначала вызывается родительский обработчик кликов, затем вызывается дочерний элемент, а потом снова вызываются родители. Прекращение пропирации не меняет этого. Возврат false приводит только к родительскому, а затем к ребенку, но это также приводит к тому, что тумблер не работает.
Коммутатор включает эти свойства в css,
.onoffswitch-switch {
-moz-transition: all 0.3s ease-in 0s; -webkit-transition: all 0.3s ease-in 0s;
-o-transition: all 0.3s ease-in 0s; transition: all 0.3s ease-in 0s;
}
.onoffswitch-inner {
-moz-transition: margin 0.3s ease-in 0s; -webkit-transition: margin 0.3s ease-in 0s;
-o-transition: margin 0.3s ease-in 0s; transition: margin 0.3s ease-in 0s;
}
Может быть, это актуально?
РЕДАКТИРОВАНИЕ 2: Я решил решить мою проблему, взяв ящики из родителя и помещая их вместо этого в родительский родитель, который не отвечает на клики, а затем позиционирует их в зависимости от положения панелей, которым они соответствуют. Я все равно хотел бы выяснить, почему у меня возникла проблема.
У меня нет проблем с вашим кодом в Firefox 28 или в Chrome 34.x. Какую версию вы используете?
Попробуйте удалить
event.stopPropagation();
event.stopPropagation();
и просто напишите
return false;
return false;
предотвращает действие по умолчанию, оно не останавливает процесс барботирования.