0

У меня есть скрипт, который при клике на кнопку добавляет на страницу ul c li. Когда фокус находится на li и пользователь нажимает Enter - я создаю еще 1 li и вставляю после первого. После чего делаю на последнем фокус. Например:

let activeLi;//активная li
let newLi = $('<li></li>');
activeLi.after(newLi);
newLi.focus();

Html имеет такой вид

<div contenteditable="true">
    <ul>
        <li></li>
    </ul>
</div>

Но фокус не ставится на новый элемент, а остается на старом. В чем моя ошибка?

10
  • activeLi.afetr(newLi); не afetr а after 6 ноя 2018 в 23:12
  • Ваши ошибка в том, что вы не смотрите консоль, в которой написана ошибка. 7 ноя 2018 в 4:11
  • @UbuntuUser, опечатка
    – Diefair
    7 ноя 2018 в 8:42
  • @StepanKasyanenko, ошибок в консоли нету
    – Diefair
    7 ноя 2018 в 8:43
  • а что консоль показывает после activeLi.after(newLi); - console.log(newLi); 7 ноя 2018 в 8:47

1 ответ 1

0

Не забывай про tabindex и всё будет работать:

$("li").focus().parent().keypress(function (e) {
  if (e.keyCode === 13) {
    var li = $("<li tabindex=0>")
    $(e.target).after(li)
    li.focus()
  }
})
ul { counter-reset: i }
li { counter-increment: i }
li:after { content: counter(i) }
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<ul>
  <li tabindex=0>
</ul>

3
  • немного не те. у меня contenteditable. то есть, у меня не просто фокус, а курсор стоит. и мне надо что бы курсор становился в новый созданный li
    – Diefair
    7 ноя 2018 в 12:51
  • @Diefair, тогда используй не focus, а selection api, только jquery идёт лесом.
    – Qwertiy
    7 ноя 2018 в 14:08
  • можно и на обычном js. можете подсказать как это сделать с помощью selection api?
    – Diefair
    7 ноя 2018 в 14:18

Ваш ответ

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

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