1

В блоке div.divClass такой перечень элементов:

span p span p span ...

span - кликабельный, нужно на событие onCLick определить, какой по счету span нажат, как это сделать ?

Я пробовал через метод index(), но он учитывает не точки порядок спанов..

3 ответа 3

2

ред.: можно найти все предыдущие спаны через prevAll()

$("span").click(function(){
  let idx = $(this).prevAll("span").length;
  console.log(idx);
});
p { margin: 0; display: inline; }
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div>
  <span>span</span>
  <p>p</p>
  <span>span</span>
  <p>p</p>
  <span>span</span>
  <p>p</p>
</div>
<div>
  <span>span</span>
  <p>p</p>
  <span>span</span>
  <p>p</p>
  <span>span</span>
  <p>p</p>
</div>

2
  • Возможно, имелся в виду индекс внутри заданного контейнера.
    – user176262
    4 июн 2020 в 16:34
  • @Igor да, вероятно так. я почему-то решил, что привязка к родителю останется. тогда через prevAll.
    – teran
    4 июн 2020 в 16:43
0

Можно каждому span в этом листе выдать пользовательский атрибут - скажем, data-span-index - и проиндексировать их там. Потом в обработчике получать индекс (event.target.getAttribue('data-span-index') или, средствами jq, event.target.attr('data-span-index'))

0

Можно как-то так без библиотек. Поместить все span в массив, и уже по нему искать порядок элемента

const block = document.querySelector('.block');
const spanArr = []
for (el of block.children) {
  if (el.tagName == 'SPAN') {
    spanArr.push(el)
  }
}

block.addEventListener('click', (e) => {
  let idx = spanArr.findIndex( span => span === e.target)
  if (idx !== -1) {
    idx++
    alert(idx)
  }
})

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.