Как отменить обработку событий у родительских элементов на Jquery?

Question

[MaxKondratenko]

В общем то всё работает. Но стало интересно есть ли какое то более правильное решение.

Есть слайдер, элементы списка в нём появляются после загрузки фотографий на сервер.
Структура чтобы было понятнее выглядит примерно так.

<ul>
     <li>
        <span></span>
     </li>
     <li>
        <span></span>
     </li>
</ul>

Теперь при нажатии на li у меня в другом месте заменяется фоновая картинка.
Вот таким способом.

$("#slider").on("click", "li", function() {
		  var bg = ($(this).css('background-image'));
		 if (span == true) {span=false; return false;}
		  else {
		  $("#drop_files").css({'backgroundImage' : ''+bg+'', 'background-size' : 'cover', 'opacity' : '0'});
		  $('#drop_files').animate({opacity: 1}, 300);
		  }
		  })

span = true сделано для того, чтобы когда я обрабатываю клик по span не заменялась картинка, так как span у меня удаляет файл с сервера и эскизы и если убрать эту переменную , то при нажатии на span выполняется та же функция которая срабатывает при клике по li

$("#slider").on("click","span", function() {
		span = true;
    ............
})

В общем то вопрос в следующем. Как можно сделать это всё по другому ? потому что мне кажется , что мой вариант хоть и рабочий, но далеко не самый лучший.
Спасибо всем заранее за помощь. Я ведь только учусь )

Answer 1

[Максим Соловьёв]

e.stopPropagation()

Comments

[Денис Кайназаров]

Спасибо огромное - помогло, правда не в таком контексте как у MaxKondratenko

Answer 2

[XpeH Петрович]

помимо того что абсолютно верно заявил предыдущий оратор, неплохо было бы передавать объект вызывающий событие в лямбду

$("selector").on("someEvent", function(event){
 // ...code
});

тогда будет доступен $(event.target), вкупе с event.stopPopagation() парсер точно не ошибется.
и старайтесь не использовать this, хотя бы пока что, начинающие разработчики часто путаются в его контексте

Comments

[Евгений Петров]

Технически можно обойтись arguments[0] — передача есть всегда, независимо от того, названы переменные или нет.

[MaxKondratenko]

поясните немного про Arguments[0] , this вроде всё нормально не путаюсь )

[Максим Соловьёв]

MaxKondratenko: внутрь функции всегда передаются документы. Можешь внутри любой функции написать console.log(arguments) и посмотреть.

[Максим Соловьёв]

Максим Соловьёв: не документы, а параметры, конечно же. Чёрт попутал :)