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 that you have read and understand our privacy policy and code of conduct.

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