JSFiddle - React, Tailwind, and code Playground

by joopmicroop

HTML

<input value='will keep selection' class="keepSelection"/>
<input value='will NOT keep selection'/>

JavaScript

[].filter.call(document.getElementsByTagName('input'),function(v,i,a){
    var ks = v.classList.contains('keepSelection');
    if(!ks)
        v.addEventListener('click', function(e){
            var target = e.target || e.srcElement;
            //e.relatedTarget.setSelectionRange(e.relatedTarget.sel.start, e.relatedTarget.sel.end);
            //e.relatedTarget.blur();
            console.log(e);
            //target.setSelectionRange(0, 0);
        }, false);
    return ks;
}).forEach(function(v,i,a){   
    v.addEventListener('select', function(e){
        var target = e.target || e.srcElement;
        target.sel = {start:target.selectionStart, end:target.selectionEnd};
    },false);
    v.addEventListener('blur', function(e){
        var target = e.target || e.srcElement;
        target.setSelectionRange(target.sel.start, target.sel.end);
        document.focus();
        //e.relatedTarget.click()
        //target.selectionStart = target.sel.start;
        //target.selectionEnd = target.sel.end;
        //target.setSelectionRange(target.sel.start, target.sel.end);
        //e.relatedTarget.focus();
    },false);
});