Stil mit {stil}

Aug 2007

Javascript select • Markieren eines Texts in einem Eingabefeld

select • Javascript-Ereignis für INPUT und TEXTAREA

Das Javascript-Ereignis select rut einen Event Handler auf, wenn der Benutzer einen Text in einem Eingabefeld markiert. 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.

addEvent(window,'load',doOnSelect,false);

function doOnSelect(evt) {
   if (!document.getElementById) return true;
   var formInput = document.getElementById ('input');
   var textarea = document.getElementById ('textarea');
   addEvent (formInput, 'select', alertUser, false);
   addEvent (textarea, 'select', alertUser, false);
}

function alertUser(evt) {
   evt = (evt) ? evt : ((window.event) ? window.event : "");
   var elem = (evt.target) ? evt.target : evt.srcElement;
   var messageBox = document.getElementById('response');
   messageBox.innerHTML = 'Text wurde in ' + elem.tagName + ' markiert ';
}

<form>
<p>
   <input type="text" name="text" value="Markieren Sie eine Textstelle" id="input" />
</p>
   <textarea rows="10" id="textarea">Markieren Sie eine Textstelle</textarea>
<p id="response"></p>
</form>

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

true, wenn die Aktion des Ereignis verhindert werden kann

timeStamp

Zeit in Millisekunden, zu der das Ereignis eingetreten ist