:
Specific implementation:
1. textarea TAG content
Copy codeThe Code is as follows:
<Span style = "font-size: 14px;"> <tr>
<Td align = "right" valign = "top"> Note: </td>
<Td> <textarea name = "" id = "remark" cols = "" rows = "" class = "textarea220" onfocus = "this. className = 'textea220l '; this. onmouseout = ''; getAddFocus ('remark');" onblur = "this. className = 'texta220'; this. onmouseout = function () {this. className = 'texta220'}; lostAddFocus ('remark'); "onmousemove =" this. className = 'textea220lg '"onmouseout =" this. className = 'texta220' "> </textarea> </td>
</Tr> </span>
2. Initialization enables up to 50 words to be entered when you click the Add button.
Copy codeThe Code is as follows:
<Span style = "font-size: 14px;" >$ ("# introduction"). val ("up to 50 words can be entered ");
Document. getElementById ("introduction"). style. color = "gray"; </span>
3. js scripts
Copy codeThe Code is as follows:
<Span style = "font-size: 14px;"> function getAddFocus (id) {// for the introduction and remarks in the add operation, textarea obtains the focus clearing input box.
Var textarea = document. getElementById (id );
Textarea. value = "";
Textarea. style. color = "black ";
}
Function lostAddFocus (id) {// for the introduction and remarks in the add operation, when textarea loses focus and the content is empty, a prompt message is displayed.
Var textarea = document. getElementById (id );
Var textarea_value = textarea. value;
If (textarea_value = ""){
Textarea. value = "up to 50 words can be entered ";
Textarea. style. color = "gray ";
}
} </Span>
For the usage of textarea focus written by csdn partners, refer:
Copy codeThe Code is as follows:
<Span style = "font-size: 14px;"> 1. display the default text in the text box:
<Textarea> pigeon boys </textarea>
<Textarea> pigeon boys </textarea>
2. Click the text box, and the default text disappears:
<Textarea onfocus = "if (value = 'pigeon boys ') {value =''} "> pigeon boys </textarea>
<Textarea onfocus = "if (value = 'pigeon boys ') {value =''} "> pigeon boys </textarea>
3. move the cursor to the text box, and the default text disappears:
<Textarea onmouseover = "focus ()" onfocus = "if (value = 'pigeon boys ') {value =''} "> pigeon boys </textarea>
<Textarea onmouseover = "focus ()" onfocus = "if (value = 'pigeon boys ') {value =''} "> pigeon boys </textarea>
4. Click the text box, and the default text disappears. Click any area outside the text box to reproduce the default text:
<Textarea onfocus = "if (value = 'pigeon boys ') {value =''} "onblur =" if (value = '') {value = 'pigeon boys '} "> pigeon boys </textarea>
<Textarea onfocus = "if (value = 'pigeon boys ') {value =''} "onblur =" if (value = '') {value = 'pigeon boys '} "> pigeon boys </textarea>
5. Move the mouse to the text box. The default text disappears. Move the mouse out of the text box. The default text is displayed again:
<Textarea onmouseover = "focus ()" onfocus = "if (value = 'pigeon boys ') {value =''} "onmouseout =" blur () "onblur =" if (value = '') {value = 'pigeon boys '}"> pigeon boys </textarea>
<Textarea onmouseover = "focus ()" onfocus = "if (value = 'pigeon boys ') {value =''} "onmouseout =" blur () "onblur =" if (value = '') {value = 'pigeon boys '}"> pigeon boys </textarea>
6. Click the text box, and any text in the text box will disappear (including the default text and subsequent text ):
<Textarea onclick = "value ='' "> pigeon boys </textarea>
<Textarea onclick = "value ='' "> pigeon boys </textarea>
7. move the cursor to the text box, and any text in the text box disappears (including the default text and subsequent text ):
<Textarea onmouseover = "value ='' "> pigeon boys </textarea>
<Textarea onmouseover = "value ='' "> pigeon boys </textarea>
8. Click the text box and select all text in the text box:
<Textarea onfocus = "select ()"> pigeon boys </textarea>
<Textarea onfocus = "select ()"> pigeon boys </textarea>
9. move the cursor to the text box and select all text in the text box:
<Textarea onmouseover = "focus ()" onfocus = "select ()"> pigeon boys </textarea>
<Textarea onmouseover = "focus ()" onfocus = "select ()"> pigeon boys </textarea>
10. Press enter to move the focus from the current text box to the next text box:
<Textarea onkeydown = "if (event. keyCode = 13) event. keyCode = 9"> pigeon boys </textarea>
<Textarea onkeydown = "if (event. keyCode = 13) event. keyCode = 9"> pigeon boys </textarea>
11. Press enter and move the focus from the current text box to the specified position:
<Textarea onkeypress = "return focusNext (this, 'Id of the specified location', event)"> pigeon boys </textarea> </span>