Firefox не позволяет выделять два текста одновременно - PullRequest
0 голосов
/ 07 марта 2019

У меня есть два основных способа ввода текста на странице HTML, если ни один из них не находится в фокусе, и я нажимаю сочетание клавиш CTR + A или CMD + A, тогда содержимое обоих текстовых вводов не выделяется в Firefox, нормально работает на Chrome

<div>
<input type="text" onkeydown="myFunction(event)" value="test">
<input type="text" value="test1">
</div> 

Даже API выбора не работает должным образом в Firefox, т.е. он не выделяет два текстовых поля одновременно. Я создал эту скрипку объяснить проблему. Мне нужно выбрать все текстовое содержимое для ввода под определенным родительским узлом (в моем случае это div), эта скрипка работает нормально, как и ожидалось, как на chrome, так и на safari, но не на firefox,

Я пробовал как API диапазона, так и API выбора следующим образом

window.getSelection().selectAllChildren(event.target.parentNode);

или

let range = document.createRange();

range.setStart(event.target.parentNode, 0);
range.setEnd(event.target.parentNode, 1);

window.getSelection().removeAllRanges();
window.getSelection().addRange(range);

1 Ответ

0 голосов
/ 07 марта 2019

Да. Firefox не позволяет выбирать содержимое ввода.Я полагаю, что это мера безопасности.

Вы можете обойти эту проблему, установив свойство textContent своих входов, таким образом, вы сможете выбирать и копировать их содержимое даже в Firefox.

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

document.onselectionchange = e => {
  console.log(e);
  // every time the selection changes
  document.querySelectorAll('input').forEach(el => {
    // except when we are the one in focus
    if(document.activeElement === el) return;
    // update each <input>'s textContent property
    el.textContent = el.value;
  })
}
<p>Try to select all (ctrl+A) the page and copy to clipboard (ctrl+C)</p>

<div>
  <input type="text" value="test">
  <input type="text" value="test1">
</div>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...