1 <html> 2 <head> 3 <title> New Document </title> 4 <script type="text/javascript" src="jquery.js"> </script> 5 <script type="text/javascript"> 6 $(function(){ 7 $(".blur_text").focus(function(){ 8 var txt_value = $(this).val(); //得到当前文本框的值 9 if(txt_value == this.defaultValue){ 10 $(this).val("");//如果符合条件就清空文本框 11 $(this).css("color","red"); 12 } 13 }) 14 $(".blur_text").blur(function(){ 15 var txt_value = $(this).val(); 16 if(txt_value == ""||txt_value==this.defaultValue){ 17 $(this).css("color","green"); 18 $(this).val(this.defaultValue); 19 } 20 }) 21 }) 22 23 //验证必填项 24 function CheckMustWrite() { 25 var count = $("input[mustwrite='true']", document.forms[0]); 26 for (var i = 0; i < count.length; i++) { 27 if (count[i].value == "") { 28 alert(count[i].title + " 为必填项"); 29 count[i].focus(); 30 return false; 31 } 32 } 33 34 var textareas = $("textarea[mustwrite='true']", document.forms[0]); 35 for (var i = 0; i < textareas.length; i++) { 36 if (textareas[i].value == "") { 37 alert(textareas[i].title + " 为必填项"); 38 textareas[i].focus(); 39 return false; 40 } 41 } 42 } 43 </script> 44 </head> 45 <body> 46 <div class="cbg" align="center" > 47 <h2 align="center"> <span> 多个文本框的提示功能 </span><br />多个文本框 </h2> 48 <table border="1" cellpadding="5" cellspacing="0" width="50%"> 49 <tbody> 50 <tr> 51 <td>名称1： </td> 52 <td><input id="DATA_1" mustwrite="true" name="DATA_1" title="名称1" type="text" class="blur_text" value="测试_1" /></td> 53 54 <td>名称2： </td> 55 <td><input id="DATA_2" mustwrite="true" name="DATA_2" title="名称2" type="text" class="blur_text" value="测试_2" /></td> 56 </tr> 57 <tr> 58 <td>名称3： </td> 59 <td><input id="DATA_3" mustwrite="true" name="DATA_3" title="名称3" type="text" class="blur_text" value="测试_3" /></td> 60 61 <td>名称4： </td> 62 <td><input id="DATA_4" name="DATA_4" title="名称4" type="text" value="测试_4" class="blur_text" /></td> 63 </tr> 64 <tr> 65 <td>名称5： </td> 66 <td colspan="3"><textarea id="DATA_5" name="DATA_5" title="名称5" class="blur_text" >测试_5</textarea></td> 67 </tr> 68 <tr> 69 <td>名称6： </td> 70 <td colspan="3"><textarea id="DATA_6" name="DATA_6" title="名称6" class="blur_text" >测试_6</textarea></td></tr> 71 </tbody> 72 </table> 73 <input id="Image1" type="image" src="imgs/submit.png" onclick="return CheckMustWrite()" onserverclick="Button1_Click" runat="server" /> 74 </div> 75 </div> 76 </body> 77 </html>