VirtualMV/JavaScript/Forms/Events
From WikiEducator
< VirtualMV | JavaScript
Overview
By the end of this page you will be able to:
|
Form events (js5_02)
Event | Comment |
onFocus | When you click on the document object |
onBlur | When the object loses focus |
onChange | When you make a change AND lose focus |
onMouseOver | When you move the mouse over the document object |
<html> <head> <title>Text Field Events (js5_02)</title> <script type="text/javascript"> function fnWriteIt(strWord){ var strInput_with_return = strWord + "\n"; window.document.frmTest.txtComment.value += strInput_with_return; } function fnMouse(){ window.document.frmTest.txtInputMouse.value += ">"; } </script> </head> <body> <form name="frmTest"> <p>Enter some text <input type="text" name="txtInput" onFocus="fnWriteIt('focus');" onBlur="fnWriteIt('blur');" onChange="fnWriteIt('change');" </p> <p>Move mouse over this <input type="text" name="txtInputMouse" onMouseOver="fnMouse()";> </p> <textarea name="txtComment" rows="5" cols="20" ></textarea> </body> </html>
Example :Click here to run js5_02.
mouseover (js5_03)
<html> <head> <title>Mouseover (js5_03)</title> </head> <body> <form name="frmMethod"> <input type="text" name="method_text" size=40 value="Use the fork, Luke, use the fork.."> </form> Mouseover to <br /> <a href="#" onMouseOver="window.document.frmMethod.method_text.focus();">get focus</a> <a href="#" onMouseOver="window.document.frmMethod.method_text.blur();">lose focus</a> <a href="#" onMouseOver="window.document.frmMethod.method_text.select();">select</a><br /> </body> </html>
Notes:
- When you mouse over
- get focus the "edit" cursor appears at the start of the text box
- lose focus the "edit" cursor disappears from the text box
- If you mouse over select the text is highlighted and get/lose focus do not work. Click away from text box to deactivate the selection.
Example :Click here to run js5_03.
References
virtualMV | Superquick wiki guide | Please give me some feedback |
VirtualMV/JavaScript/Forms/Events. (2024). In WikiEducator/VirtualMV wiki. Retrieved December 26, 2024, from http:https://wikieducator.org/VirtualMV/JavaScript/Forms/Events (zotero)
|