Use of the textarea focus to get the focus clear lost focus prompt effect

Effect:
< img SRC = "border = 0 / / files.jb51.net/file_images/article/201405/20140519171119.jpeg? 2014419171141 ">
Specific implementation:

1. Textarea label contents

 
<span style="font-size:14px;"><tr> 
<td align="right" valign="top"> Remark: </td> 
<td><textarea name="" id="remark" cols="" rows="" class="textarea220" onfocus="this.className='textarea220L';this.onmouseout='';getAddFocus('remark');" onblur="this.className='textarea220';this.onmouseout=function(){this.className='textarea220'};lostAddFocus('remark');" onmousemove="this.className='textarea220Lg'" onmouseout="this.className='textarea220'"></textarea></td> 
</tr></span> 

2. Initialize the content display to input up to 50 words when the add button is clicked

 
<span style="font-size:14px;">$("#introduction").val(" Maximum input 50 A word "); 
document.getElementById("introduction").style.color="gray";</span> 

3. Js script

 
<span style="font-size:14px;">function getAddFocus(id){//For the introduction and comments in the add operation, the textarea gets focus and clears the input box
var textarea=document.getElementById(id); 
textarea.value=""; 
textarea.style.color="black"; 
} 

function lostAddFocus(id){//When the textarea loses focus and the content is empty, a prompt is displayed for the introduction and remarks in the add operation
var textarea=document.getElementById(id); 
var textarea_value=textarea.value; 
if(textarea_value==""){ 
textarea.value=" Maximum input 50 A word "; 
textarea.style.color="gray"; 
} 
}</span> 

The usage of textarea focus written by CSDN partner:

 
<span style="font-size:14px;"> 1. Text box displays default text:  

<textarea> Dove boy </textarea> 
<textarea> Dove boy </textarea> 
　　2. Click the text box, the default text disappears:  

<textarea onfocus= " if(value==' Dove boy ') {value='  ' } " > Dove boy </textarea> 
<textarea onfocus= " if(value==' Dove boy ') {value='  ' } " > Dove boy </textarea> 
　　3. Mouse over the text box, the default text disappeared:  

<textarea onmouseover= " focus() "  onfocus= " if(value==' Dove boy ') {value='  ' } " > Dove boy </textarea> 
<textarea onmouseover= " focus() "  onfocus= " if(value==' Dove boy ') {value='  ' } " > Dove boy </textarea> 
　　4. Click the text box, the default text disappears, click any area outside the text box, the default text reappears:  

<textarea onfocus= " if(value==' Dove boy ') {value='  ' } "  onblur= " if(value=='  ' ) {value=' Dove boy '} " > Dove boy </textarea> 
<textarea onfocus= " if(value==' Dove boy ') {value='  ' } "  onblur= " if(value=='  ' ) {value=' Dove boy '} " > Dove boy </textarea> 
　　5. Mouse over the text box, the default text disappeared, mouse over the text box, the default text again:  

<textarea onmouseover= " focus() "  onfocus= " if(value==' Dove boy ') {value='  ' } "  onmouseout= " blur() "  onblur= " if (value=='  ' ) {value=' Dove boy '} " > Dove boy </textarea> 
<textarea onmouseover= " focus() "  onfocus= " if(value==' Dove boy ') {value='  ' } "  onmouseout= " blur() "  onblur= " if (value=='  ' ) {value=' Dove boy '} " > Dove boy </textarea> 
　　6. Click on the text box, any text in the text box disappeared (including the default text and later input text) :  

<textarea onclick= " value='  '" > Dove boy </textarea> 
<textarea onclick= " value='  '" > Dove boy </textarea> 
　　7. Mouse over the text box, the text box any text disappeared (including the default text and later input text) :  

<textarea onmouseover= " value='  '" > Dove boy </textarea> 
<textarea onmouseover= " value='  '" > Dove boy </textarea> 
　　8. After clicking the text box, select all the text in the text box:  

<textarea onfocus= " select() " > Dove boy </textarea> 
<textarea onfocus= " select() " > Dove boy </textarea> 
　　9. Mouse over the text box all selected text box:  

<textarea onmouseover= " focus() "  onfocus= " select() " > Dove boy </textarea> 
<textarea onmouseover= " focus() "  onfocus= " select() " > Dove boy </textarea> 
　　10. After hitting enter, the focus shifts from the current text box to the next text box:  

<textarea onkeydown= " if(event.keyCode==13)event.keyCode=9 " > Dove boy </textarea> 
<textarea onkeydown= " if(event.keyCode==13)event.keyCode=9 " > Dove boy </textarea> 
　　11. After hitting enter, the focus shifts from the current text box to the specified location:  

<textarea onkeypress= " return focusNext(this,' location-specific id The name of the ',event) " > Dove boy </textarea> </span>