Не находит тег p:focus jQuery

141
15 марта 2019, 23:20

У меня есть div с id="editor". У него задано contenteditable. Дальше, в нем лежит 3 тега p. находясь в каком то из них (стоит курсор) я хочу получить индекс этого p. Для этого я делаю

$("#editor p:focus").index();

И получаю -1, то есть не находит. Вопрос: почему?

Уточнение: если сделать так

console.log($(":focus").html());

Выводит содержимое дива с id #editor. Выходит, что p не может получить фокус?

Answer 1

есди я правильно понял проблему, то вам необходимо получить индекс р, в котором находится курсор. можете посмотреть следующее решение:

 let div = document.querySelector('div'); 
let arrP = Array.from(div.querySelectorAll('p')); 
div.addEventListener('click', () => { 
  let range = window.getSelection().getRangeAt(0); 
  let pStart = range.startContainer.nodeType === 3 
    ? range.startContainer.parentNode.closest('p') 
    : range.startContainer.closest('p') 
  let pEnd = range.endContainer.nodeType === 3 
    ? range.endContainer.parentNode.closest('p') 
    : range.endContainer.closest('p') 
console.log(arrP.indexOf(pStart),arrP.indexOf(pEnd)) 
   
})
<div contenteditable = "true"> 
  <p>test0</p> 
  <p>test1</p> 
  <p>test2</p> 
 </div>

если нужны пояснения, то спрашивайте. да, и фокус передается не р а contenteditable элементу

READ ALSO
Не выводит информацию из json

Не выводит информацию из json

Суть в том что делаю запрос на файл с поиском ID И просто он всегда отвечает False прошу помочь

166
getJSON внутри функции

getJSON внутри функции

Продолжение данной темы Поиск и возврат значения по ID (for json) Возникла другая проблемаИзначально планировалось использовать данный код, как...

143