Я не могу шов, чтобы остановить распространение сигнала щелчка на родительский элемент. У меня есть поиск и просмотр многих вопросов здесь, но я не мог найти решение, которое работает. Я тестирую в Firefox.Я не могу прекратить распространение события click на родительский элемент
//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);
});
Последний обработчик для родительского элемента называется, который мне необходимо предотвратить.
EDIT 1:
Я думаю, что проблема должна быть с CSS для переключателя флажок/тумблера. Я автоматически создал его здесь, 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;
}
Может быть, это имеет отношение?
EDIT 2: Я решил решить проблему, взяв ящики из родителя и помещая их вместо этого в родительский родитель, который не отвечает на клики, а затем позиционирует их в зависимости от положения панелей, которые они соответствуют к. Я все равно хотел бы выяснить, почему у меня возникла проблема.
Когда я попробовал это (правда, в странным образом, но все же), ваш код работает для меня в Chrome. Можете ли вы упростить свой код и добавить HTML-код (иметь элемент, динамически добавлять элементы и события и видеть, продолжают ли они распространяться)? – PhistucK
Странная вещь заключается в том, что она гласит, что родительский элемент обрабатывает сигнал щелчка перед дочерним элементом. – tAllan