Я хотел бы сосредоточить элемент.editor на каждом нажатии на.step. Проблема в том, что я бы хотел исключить нажатие на кнопки:.new,.delete,.copy,.resize. Если я нажимаю кнопки, я не фокусируюсь, просто выполняю настройку других функций отдельно. Как я могу это сделать. Это html-структура:
<div class="step">
<div class="editor"></div>
<div class="new"></div>
<div class="delete"></div>
<div class="copy"></div>
<div class="resize"></div>
</div>
Вот мой неправильный jQuery:
$(document).on('click', '.step', function() {
if ( $(this) !== $(".sort-slides") || $(".draggable_on") || $(".copy-slide") || $(".new-slide") || $(".delete-slide") )
$(this).find(".editor").focus();
});
В JavaScript, когда событие срабатывает над элементом, оно запускается для каждого из предков элементов. Это называется распространением событий. Можно остановить это поведение, вернув false
из обработчика событий.
$(".new, .delete, .copy, .resize").click(function(event) {
// do something
alert("click");
// prevent the event from propagating
return false;
});
$(".step").click(function() {
// do something
alert("focus");
});
Вот пример на CodePen.
Однако, как сказал Гупта, функция focus
применима только к тегам <input>
, <select>
и <a>
.
Прежде всего, ваш оператор if неверен.
if (x == 1 || 2 || 3 || 4 || 5) { ... }
это не то же самое, что
if (x == 1 || x == 2 || x == 3 || x == 4 || x == 5) { ... }
Утверждение всегда будет возвращать true, поскольку ничего, кроме 0, будет правдивым. Таким образом, даже если x будет 0, утверждение будет
if (false || true || true || true || true) { ... }
Кроме того, $(this)
всегда будет .step
поймать событие click, а не все его дочерние элементы.