javascript - Is it possible to get selectionchange-like events for an input box in Firefox? -
how can selected text inside input
box in firefox?
this apparently fundamental difference in way javascript works between chrome , firefox. reproduce:
- navigate www.google.com
- open js console
- type following line:
document.addeventlistener("selectionchange", () => console.log(document.getselection().tostring()))
- type "text" google search box , not hit enter
- use mouse select different portions of "text" in search box
in chrome, see event raised selected text within input
element. consistent across various web pages use input
fields. in firefox, event raised selections outside input
, when text in box selected, no event raised.
i have not found explicit reference difference in mozilla documentation, nor have found mention of on other web page.
related different question
firefox web extension “selectionchange” older question, , dom.select_events.enabled
config attribute defaulted true
in ff 56. there second config attribute, dom.select_events.textcontrols.enabled
seems i'm looking for, changing value true
doesn't seem have effect.
additional info (edit 1)
apparently there isn't way selected text in textbox in ff? following code doesn't work:
setinterval(() => console.log(document.getselection().tostring()), 1000)
in ff, never return selected text in input field. in chrome, will.
is feature gap in ff? there no other way extract selected text form field?
based on this answer have been able create following:
window.addeventlistener('mouseup', function () { selection = getselectedtext(); }); function getselectedtext() { let elem = document.activeelement; let elemtype = elem ? elem.tagname.tolowercase() : 'none'; if (elemtype === 'input' || elemtype === 'textarea') { return elem.value.substr(elem.selectionstart, elem.selectionend - elem.selectionstart); } if (window.getselection) { return window.getselection().tostring(); } if (document.selection && document.selection.type !== 'control') { return document.selection.createrange().text; } return ''; }
my testing far shows seems work both chrome , firefox.
Comments
Post a Comment