使用ajax()方法加载服务器数据
使用ajax()方法是最底层、功能最强大的请求服务器数据的方法，它不仅可以获取服务器返回的数据，还能向服务器发送请求并传递数值，它的调用格式如下：
jQuery.ajax([settings])或$.ajax([settings])
其中参数settings为发送ajax请求时的配置对象，在该对象中，url表示服务器请求的路径，data为请求时传递的数据，dataType为服务器返回的数据类型，success为请求成功的执行的回调函数，type为发送数据请求的方式，默认为get。
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>使用ajax()方法加载服务器数据</title>
5 <script src="http://libs.baidu.com/jquery/1.9.0/jquery.js" type="text/javascript"></script>
6 <style>
7 #divtest
8 {
9 width: 282px;
10 }
11 #divtest .title
12 {
13 padding: 8px;
14 background-color:Blue;
15 color:#fff;
16 height: 23px;
17 line-height: 23px;
18 font-size: 15px;
19 font-weight: bold;
20 }
21 ul
22 {
23 float: left;
24 width: 280px;
25 padding: 5px 0px;
26 margin: 0px;
27 font-size: 14px;
28 list-style-type: none;
29 }
30 ul li
31 {
32 float: left;
33 width: 280px;
34 height: 23px;
35 line-height: 23px;
36 padding: 3px 8px;
37 }
38 .fl
39 {
40 float: left;
41 }
42 .fr
43 {
44 float: right;
45 }
46 </style>
47 </head>
48
49 <body>
50 <div id="divtest">
51 <div class="title">
52 <span class="fl">检测数字的奇偶性</span>
53 <span class="fr">
54 <input id="btnCheck" type="button" value="检测" />
55 </span>
56 </div>
57 <ul>
58 <li>请求输入一个数字
59 <input id="txtNumber" type="text" size="12" />
60 </li>
61 </ul>
62 </div>
63
64 <script type="text/javascript">
65 $(function () {
66 $("#btnCheck").bind("click", function () {
67 $.ajax({
68 url:"./8-5.php",
69 data: { num: $("#txtNumber").val() },
70 type:"post",
71 success: function (data) {
72 $("ul").append("<li>你输入的<b> "
73 + $("#txtNumber").val() + " </b>是<b> "
74 + data + " </b></li>");
75 }
76 });
77 });
78 });
79 </script>
80 </body>
81 </html>
1 <?php
2 $num = $_POST[‘num‘];
3 if($num%2==0){
4 echo "偶数";
5 }else{
6 echo "奇数";
7 }
时间： 2024-10-13 01:40:53