onselect klingt, als wäre es ein Event für ein select-Element in einem Formular, reagiert aber tatsächlich auf das Markieren eines Textes in einem Eingabefeld (beim Ändern von input, textarea und select feuert ein onchange-Event).
Das select-Event wird z.B. für Editoren eingesetzt – etwa in den Editoren von Content Management Systemen, wo der Editor erkennen muss, dass ein Text markiert wurde, um über einen Button fett gesetzt zu werden.
Markierten Text erkennen
Wenn der Benutzer Text in einem input- oder textarea-Feld markiert (gleich, ob durch Klicken und Ziehen der Maus oder durch Tastatur-Befehle wie Shift + Rechtspfeil), meldet sich das select-Event.
Ein Event Handler für textarea könnte z.B. einen markierten Text in strong-Tags setzen, um ein Textfeld mit zusätzlichen Funktionen auszustatten.
const in1 = document.getElementById ('in1');
const t1 = document.getElementById ('t1');
in1.onselect =
t1.onselect = function(evt) {
let selectedText = "";
if (window.getSelection) {
if (this.getAttribute("id") === "t1") {
selectedText = this.value.substring(t1.selectionStart,t1.selectionEnd);
}
if (this.getAttribute("id") === "in1") {
selectedText = this.value.substring(in1.selectionStart,in1.selectionEnd);
}
}
};
Markierten Text auf einem Touchscreen erkennen
Um ein Selektieren auf dem Touchscreen zu überwachen, wird ein EventListener für touchstart, touchmove, touchend und selectionchange gebraucht. Das Beispiel ist nur ein grobes Fragment.
onselect Attribute
- target
- Objekt zu dem das Ereignis ursprünglich gesendet wurde
- eventPhase
- Phase, in der das Ereignis bearbeitet wird: AT_TARGET, BUBBLING_PHASE, CAPTURING_PHASE
- bubbles
- true, wenn das Ereignis nach oben steigen kann
- cancelable
- Nein
- timeStamp
- Zeit in Millisekunden, zu der das Ereignis eingetreten ist
