Вставьте текст в любой произвольный текстовый элемент (не обязательно простой HTML) на странице, используя Javascript в расширении Chrome - PullRequest
0 голосов
/ 05 декабря 2018

Я пытаюсь создать расширение Chrome, которое позволяет пользователю нажимать сочетание клавиш и отображать визуальную клавиатуру рядом с текстовым полем, которое они в данный момент редактируют.

В настоящее время, когда пользователь нажимает сочетание клавишЯ проверяю, есть ли активный элемент, который является текстовым полем, используя следующий фрагмент:

/* Get the active textbox on the window, ie. the one with the blinking cursor the user is typing in */
function get_active_textbox() {
    let activeElement = document.activeElement;

    // Is there an active element, and if so, is it of type `text`? Other types of active elements could be checkboxes
    // or radio buttons
    if (activeElement && activeElement.type === "text") {
        return activeElement;
    }
}

Как только у меня есть текстовое поле, я могу легко вставить свой текст в него.Это отлично работает для обычных текстовых полей, но не для ситуаций, когда текстовое поле немного более ... сложное ... например, черновик в Google Inbox:

<div id="S2lLHf-0" tabindex="0" jsaction="blur:quickCompose9.quick_compose_handle_blur;input:quickCompose9.quick_compose_handle_input;focus:quickCompose9.quick_compose_focus" aria-label="Reply to all" jstcache="3148" class="aV editable" g_editable="true"
  role="textbox" contenteditable="true" style="direction: ltr;">this is some text</div>

или поле для составления в Facebook Messenger:

<div aria-autocomplete="list" aria-controls="js_6" aria-describedby="js_0" aria-expanded="false" aria-label="Type a message..." class="notranslate _5rpu" contenteditable="true" role="combobox" spellcheck="true" tabindex="0" style="outline: none; user-select: text; white-space: pre-wrap; overflow-wrap: break-word;">
  <div data-contents="true">
    <div class="" data-block="true" data-editor="75li5" data-offset-key="6h8f0-0-0">
      <div data-offset-key="6h8f0-0-0" class="_1mf _1mj"><span data-offset-key="6h8f0-0-0"><span data-text="true">this is some text</span></span>
      </div>
    </div>
  </div>
</div>

Существует ли решение более общего назначения, которое позволило бы мне находить и вставлять текст в любой произвольный текстовый элемент на странице?

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...