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>
