1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
2 <html xmlns="http://www.w3.org/1999/xhtml">
3 <head>
4 <title>练习</title>
5 <script src="../Scripts/jquery-1.4.1.js" type="text/javascript"></script>
6 <script type="text/javascript">
7 //加法计算
8 $(function () {
9 $("#calc").click(function () {
10 var add = $("#addNum").val();
11 var added = $("#addedNum").val();
12 $("#PlusResult").val(parseInt(add, 10) + parseInt(added, 10));
13 });
14 });
15
16 var leftTime = 10;
17 var intervalId;
18 //同意按钮倒计时
19 $(function () {
20 //初始化设置定时器
21 intervalId = setInterval("getLeftTime()", 1000);
22 });
23
24 function getLeftTime() {
25 leftTime--;
26 if (leftTime == 0) {
27 $("#agree").val("同意").attr("disabled", false);
28 clearInterval(intervalId);
29 }
30 else {
31 $("#agree").val("同意(" + leftTime + ")");
32 }
33 }
34
35 //留言的动态显示
36 $(function () {
37 $("#submit").click(function () {
38 var name = $("#uname").val();
39 var msg = $("#lmsg").val();
40
41 //构造添加的行
42 var html = "<tr>";
43 html += "<td>" + name + "说：</td>";
44 html += "<td>" + msg + "</td>";
45 html += "</tr>";
46
47 $("#tblInfo").append(html);
48 });
49 });
50 </script>
51 </head>
52 <body>
53 <div id="Plus">
54 <input id="addNum" type="text" /> +
55 <input id="addedNum" type="text" /> =
56 <input id="PlusResult" type="text" disabled="disabled" />
57 <input id="calc" type="button" value="计算" />
58 </div>
59 <hr />
60 <!--注册页面 同意按钮-->
61 <div>
62 <input id="agree" type="button" value="同意(10)" disabled="disabled" onclick="alert('注册');" />
63 </div>
64 <hr />
65 <!--页面评论无刷新-->
66 <div>
67 评论内容:
68 <table id="tblInfo">
69 </table>
70
71 <table>
72 <tr>
73 <td>您的大名：</td>
74 <td><input id="uname" type="text" /></td>
75 </tr>
76 <tr>
77 <td>您的留言：</td>
78 <td><textarea id="lmsg" rows="20" cols="40"></textarea></td>
79 </tr>
80 <tr style="text-align:center">
81 <td colspan="2"><input id="submit" type="button" value="提交留言" /></td>
82 </tr>
83 </table>
84 </div>
85 </body>
86 </html>