установить фокус, нажав на элемент, но исключая некоторые дочерние элементы

0

Я хотел бы сосредоточить элемент.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();
});
Теги:

2 ответа

1
Лучший ответ

В 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>.

1

Прежде всего, ваш оператор 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, а не все его дочерние элементы.

Ещё вопросы

Сообщество Overcoder
Наверх
Меню