Note that there are some explanatory texts on larger screens.

plurals
  1. POHow do I set a backwards selection?
    text
    copied!<p>I'm working on a custom tokenfield based on textarea. The idea is to have a textarea with div elements absolutely positioned above, so it <em>looks</em> like they are in text area.</p> <p>It was pain so far, but I managed to do pretty much everything, except one thing.</p> <p>Is it even possible in javascript to set reverse-selection? When you put a cursor somewhere in the middle of textarea, hold down shift and press left arrow a few times, you'll get a selection. The tricky part, is that it's not usual - it's backwards (it's start is to the right from the end, not like it is usually). There are placeholders in my textarea over which I display my divs (tokens). When you navigate to one of them, cursor jumps to the opposite edge of a placeholder, so it feels natural. When you hold down shift, and reach the placeholder, it jumps to the right, and it sets a new selection, so it looks like you selected the token (you can press delete, and remove selected range with token itself, which is cool). BUT it wont possibly work if you navigate from right to left, because setting a new selection would make it unreverted one:</p> <p><strong>Left-to-right selection:</strong></p> <pre><code>abcde[start]efg[end](token) [shift]+[right] abcde[start]efg(token)[end] [del] abcde </code></pre> <p><strong>Right-to-left selection</strong></p> <pre><code>(token)[end]efg[start]abcde [shift]+[left] [start](token)abcdeefg[end] //see? it's back to normal [shift]+[left] [start](token)abcdeef[end]g //huh?! shift-right moves end point (unexpected) abcde </code></pre> <p>So here's question: Can I set a selection in textarea where start point would be greater than the end point? Simply <code>element.setSelectionRange(right, left)</code> does not work in firefox, any other ideas?</p>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload