Рекурсивная функция выделения при чтении - PullRequest
Новая
       12

Рекурсивная функция выделения при чтении

0 голосов
/ 22 октября 2019

Я пытаюсь передать речевое намерение функции, которая рекурсивно запускается, пока пользователь не скажет «выход». Пока функция не выйдет, функция подсвечивает каждое слово в последовательности, соответствующей голосовым намерениям пользователя. Мой план состоит в том, чтобы создать «курсор», который является родительским узлом внутри div, структура которого выглядит так, как показано ниже: 

<div> <span id="word"+ i> </span>... </div>

каждый диапазон имеет последовательный идентификатор, чтобы их можно было легко различить. Моя главная проблема заключается в том, что я не могу понять, как установить курсор на следующий диапазон в документе.

Первоначально он установлен на window.getSelection(), затем я хочу выбрать следующий диапазон в своем div, когдапользователь вводит намерение, совпадающее с текущим курсором .innerHtml

В настоящее время я получаю сообщение о том, что в консоли «курсор не определен». 


highlightOnRead=(doc,cursor)=>{
       var transcripts=document.getElementById("transcriptSpan")
        var transcript = transcripts.innerHTML;


              if(transcript !== undefined && transcript!==" "){
              console.log("transcript",transcript)
              console.log("cursor",cursor.anchorNode.parentNode.id) //we only need the word
              console.log("cursor plus 1",cursor.anchorNode.parentNode.nextSibling.id)
              let elem = document.getElementById(cursor.anchorNode.parentNode.id) //the element where the cursor is currently

              if(transcript.includes(" ")){
                transcript = transcript.split(" ").pop()
              }
                if(transcript.toLowerCase() !== elem.innerHTML.toLowerCase() && transcript.toLowerCase() !== 'exit')
                {
                   cursor = cursor.anchorNode.parentNode.nextSibling.id
                  this.props.readAlongHighlight(doc,cursor)
                  console.log(transcript)
                }
                 cursor = cursor.anchorNode.parentNode.nextSibling.id
                  elem.style.backgroundColor = 'yellow'; //highlight the span matching the intent
                  //move the cursor to the next element in the div
              this.props.readAlongHighlight(doc,cursor)
              console.log("leaving the function")
              return
            }
            console.log("leaving the function")
          };

1 Ответ

0 голосов
/ 22 октября 2019

Я понял это! 

cursor=document.getElementById(cursor.anchorNode.parentNode.id).nextSibling.nextElementSibling;
...