Question 205757 in Html Question posted in
Some basic documentation can be found here.

Html – How to not loose selection when click on input

I have the textarea and the input below it. When I select some text from textarea and click on the input, then my selection disappears. How can I make it still visible?

<textarea style="width: 500px; height: 500px">
  Test data
</textarea>

<input> </input>
Tags:

2

Answers


  1. 0

    Copied everything you provided into a HTML editor and I didn’t run into this issue. If this is all you’ve got, you need to put it into the body or a header or something, but if you have more code written your issue is more than likely in there.

    Login or Signup to reply.
  2. 0

    You need to save the selection and restore it (on blur and focus).

    let selectionStart = 0;
let selectionEnd = 0;

textarea.addEventListener('blur', () => {
  selectionStart = textarea.selectionStart;
  selectionEnd = textarea.selectionEnd;
});

textarea.addEventListener('focus', () => {
  textarea.setSelectionRange(selectionStart, selectionEnd);
})

button.addEventListener('click', () => {
  console.log("click");
  textarea.focus();
});
    <textarea id="textarea">make a selection the click button </textarea>
<button id="button">button</button>
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search