使用ajax()方法加载服务器数据

使用ajax()方法是最底层、功能最强大的请求服务器数据的方法，它不仅可以获取服务器返回的数据，还能向服务器发送请求并传递数值，它的调用格式如下：

jQuery.ajax([settings])或$.ajax([settings])

其中参数settings为发送ajax请求时的配置对象，在该对象中，url表示服务器请求的路径，data为请求时传递的数据，dataType为服务器返回的数据类型，success为请求成功的执行的回调函数，type为发送数据请求的方式，默认为get。

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

 <html xmlns="http://www.w3.org/1999/xhtml">

     <head>

         <title>使用ajax()方法加载服务器数据</title>

         <script src="http://libs.baidu.com/jquery/1.9.0/jquery.js" type="text/javascript"></script>

         <style>

             #divtest

             {

                 width: 282px;

             }

             #divtest .title

             {

                 padding: 8px;

                 background-color:Blue;

                 color:#fff;

                 height: 23px;

                 line-height: 23px;

                 font-size: 15px;

                 font-weight: bold;

             }

             ul

             {

                 float: left;

                 width: 280px;

                 padding: 5px 0px;

                 margin: 0px;

                 font-size: 14px;

                 list-style-type: none;

             }

             ul li

             {

                 float: left;

                 width: 280px;

                 height: 23px;

                 line-height: 23px;

                 padding: 3px 8px;

             }

             .fl

             {

                 float: left;

             }

             .fr

             {

                 float: right;

             }

         </style>

     </head>

     <body>

         <div id="divtest">

             <div class="title">

                 <span class="fl">检测数字的奇偶性</span>

                 <span class="fr">

                     <input id="btnCheck" type="button" value="检测" />

                 </span>

             </div>

             <ul>

                <li>请求输入一个数字

                    <input id="txtNumber" type="text" size="12" />

                </li>

             </ul>

         </div>

         <script type="text/javascript">

             $(function () {

                 $("#btnCheck").bind("click", function () {

                     $.ajax({

                         url:"./8-5.php",

                         data: { num: $("#txtNumber").val() },

                         type:"post",

                         success: function (data) {

                             $("ul").append("<li>你输入的<b>  "

                             + $("#txtNumber").val() + " </b>是<b> "

                             + data + " </b></li>");

                         }

                     });

                 });

             });

         </script>

     </body>

 </html>
 <?php

 $num = $_POST['num'];

 if($num%2==0){

     echo "偶数";

 }else{

     echo "奇数";

 }

使用ajax()方法加载服务器数据的更多相关文章

  1. ajax验证表单元素规范正确与否 ajax展示加载数据库数据 ajax三级联动

    一.ajax验证表单元素规范正确与否 以用ajax来验证用户名是否被占用为例 1创建表单元素<input type="text" id="t"> 2 ...

  2. scrapy项目5：爬取ajax形式加载的数据，并用ImagePipeline保存图片

    1.目标分析: 我们想要获取的数据为如下图: 1).每本书的名称 2).每本书的价格 3).每本书的简介 2.网页分析: 网站url:http://e.dangdang.com/list-WY1-dd ...

  3. AJAX 动态加载后台数据 绑定select

    <select id="select"> <!--下拉框数据动态加载--> </select> js:(使用jquery) $(document ...

  4. easyui中 combogrid控件的loadData方法加载本地数据

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  5. ajax 未加载出数据时，显示loding，数据显示后，隐藏loading

    $("#CreateReport").click(function () { // RptID,Template,TemplateType,FileName var RptID = ...

  6. Tree：加载列表数据

    Tree控件,需要提供一个树形的JSON数据,才能正常显示. 通常,开发者在后台可以这样做: 1)从数据库查询出一个列表数据 2)在后台,将列表数据转换为树形数据 3)通过JSON方式返回 在前台页面 ...

  7. Python 爬取异步加载的数据

    在我们的工作中,可能会遇到这样的情况:我们需要爬取的数据是通过ajax异步加载的,这样的话通过requests得到的只是一个静态页面,而我们需要的是ajax动态加载的数据! 那我们应该怎么办呢??? ...

  8. Ajax在jQuery中的应用（加载异步数据、请求服务器数据）

    加载异步数据 jQuery中的load()方法 load(url,[data],[callback]) url:被加载的页面地址 [data]:可选项表示发送到服务器的数据,其格式为 key/valu ...

  9. jQuery.ajax( options ) : 通过 HTTP 请求加载远程数据

    jQuery.ajax( options ) : 通过 HTTP 请求加载远程数据 这个是jQuery 的底层 AJAX 实现.简单易用的高层实现见 $.get, $.post 等. $.ajax() ...

随机推荐

  1. linux od命令: 按不同进制显示文件

    介绍:od(octal dump)命令可以以八进制.十进制.十六进制和ASCII码来显示文件或者流,它们对于访问或可视地检查文件中不能直接显示在终端上的字符很有用.语法: od [-A 地址进制] [ ...

  2. div层遮盖flash(兼容浏览器)

    今天测试div层和flash的交互,发现div层总是被flash层遮盖,在百度上找了一会,说是加个<param name="wmode" value="transp ...

  3. 转：JAVA中this用法小结

    转:http://blog.sina.com.cn/s/blog_6a6badc90100t8hm.html#SinaEditor_Temp_FontName Java关键字this只能用于方法方法体 ...

  4. 批处理cmd背景颜色

    Pause  Echo 其他提示语 & pause > nul     pause暂停 COLOR 设置默认的控制台前景和背景颜色. COLOR [attr] attr 指定控制台输出的 ...

  5. CSS3制作立体导航

    <ul class="nav"> <li><a href="">首页</a></li> <li ...

  6. mongodb的常用操作(二)

    继续mongodb的学习: 9.mongodb条件查询 假设有user集合,里面结构如下:{ "_id" : ObjectId("52ab35d281181f853264 ...

  7. mysql手工注入

    以下是mynona本人原创的,奉献给大家,不要小看数据库注入 参考: http://www.daydaydata.com/help/sql/advance/limit.html http://www. ...

  8. PAT IO-03 整数均值

    /* *PAT IO-02 整数四则运算 *2015.7.30 *作者:flx413 */ #include<stdio.h> int main() { ], sum; float ave ...

  9. （ACM）C++ STL 训练（第一天）

    因为老师说ACM考的是纯C++,所以打算抛弃VS的VC++不用了,针对纯C++的编译器有Intel Compiler(不过要钱),MinGw(个人用的),当然还有微软的VC++ 编译器,IDE你们可以 ...

  10. 分析 "End" "Unload Me" "Exit Sub" 之间的区别与联系

    之前就想过这个问题,这么熟悉的几个东西居然对他们分析的不是很透彻. “End”  跟  “Unload  Me”  在敲程序 的时候经常敲到,“exit  sub”  更是熟悉,下面,解析: End  ...