jQuery确实方便，下面做个简单的Ajax调用：

建立一个简单的html文件：

 <!DOCTYPE HTML>

 <html>

 <head>

 <script type="text/javascript" src="Public/js/jquery-easyui-1.3.1/jquery-1.8.2.min.js"></script>

 <script type="text/javascript">

     $(function(){

         //按钮单击时执行

         $("#testAjax").click(function(){

               //取Ajax返回结果

               //为了简单，这里简单地从文件中读取内容作为返回数据

               htmlobj=$.ajax({url:"/Readme.txt",async:false});

                //显示Ajax返回结果

                $("#myDiv").html(htmlobj.responseText);

          });

     });

 </script>

 </head>

     <body>

         <div id="myDiv"><h2>通过 AJAX 改变文本</h2></div>

         <button id="testAjax" type="button">Ajax改变内容</button>

     </body>

 </html>

好了，点击按钮就可以看到效果了。

当然，jQuery的Ajax调用可以控制项很多，这里演示了简单的调用。

注意你自己的jquery引用路径。

好吧，做一个调用后台的例子：

 <!DOCTYPE HTML>

 <html>

 <head>

 <script type="text/javascript" src="Public/js/jquery-easyui-1.3.1/jquery-1.8.2.min.js"></script>

 <script type="text/javascript">

     $(function(){

         //按钮单击时执行

         $("#testAjax").click(function(){

               //Ajax调用处理

             var html = $.ajax({

                type: "POST",

                url: "test.php",

                data: "name=garfield&age=18",

                async: false

             }).responseText;

             $("#myDiv").html('<h2>'+html+'</h2>');

          });

     });

 </script>

 </head>

     <body>

         <div id="myDiv"><h2>通过 AJAX 改变文本</h2></div>

         <button id="testAjax" type="button">Ajax改变内容</button>

     </body>

 </html>

后台代码：

<?php

    $msg='Hello,'.$_POST['name'].',your age is '.$_POST['age'].'!';

    echo $msg;

现在已经可以从后台来获取数据了!

当然，我们还可以这样来调用Ajax:

 <!DOCTYPE HTML>

 <html>

 <head>

 <script type="text/javascript" src="Public/js/jquery-easyui-1.3.1/jquery-1.8.2.min.js"></script>

 <script type="text/javascript">

     $(function(){

         //按钮单击时执行

         $("#testAjax").click(function(){

               //Ajax调用处理

             $.ajax({

                type: "POST",

                url: "test.php",

                data: "name=garfield&age=18",

                success: function(data){

                         $("#myDiv").html('<h2>'+data+'</h2>');

                   }

             });

          });

     });

 </script>

 </head>

     <body>

         <div id="myDiv"><h2>通过 AJAX 改变文本</h2></div>

         <button id="testAjax" type="button">Ajax改变内容</button>

     </body>

 </html>

注意，

success: function(data)

中的data参数可以改为别的名称，比如success: function(msg)，msg（data）为返回的数据。 此处为回调函数的参数，而非

data: "name=garfield&age=18"

中的Ajax调用中的data参数。

jQuery简单的Ajax调用示例的更多相关文章

  1. jQuery简单的Ajax调用

    index.php 的代码如下: <!DOCTYPE HTML> <html> <head> <meta charset="UTF-8"& ...

  2. iframe式ajax调用示例

    1.新建 a.html <!doctype html> <html> <head> <meta charset='utf-8'> <title&g ...

  3. 模拟jQuery简单封装ajax

    /*模拟jQuery的写法 (简单写法)*/ var $={}; /*ajax*/ $.ajax = function (options) { /* * 请求 * 1.请求接口 type get po ...

  4. Jquery简单瀑布流代码示例

    最近很多网站都采用瀑布流风格设计,感觉挺有个性的,比较合适做图片类型的网站,没事仿开心网做一个瀑布流示例. 需要用到Jquery,jquery.masonry.min.js <!DOCTYPE ...

  5. 最简单的ajax调用webservice

    <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="TestHelloWorld ...

  6. ajax 调用示例

    $.ajax({ type: "post", url: url, data: { "key": "ValidateMobile", &quo ...

  7. jquery 封装的ajax调用

    (function(){    var Ploy = {        Config: {            ajaxUrl: "/ajax/ploy.ashx"        ...

  8. WebService--概述、JDk实现、AJAX调用

    一.Webservice概述 W3C组织对其的定义是,它是一个软件系统,为了支持跨网络的机器间相互操作交互而设计. Webservice服务通常被定义为一组模块化的API,它们可以通过网络进行调用,来 ...

  9. Asp.net中JQuery、ajax调用后台方法总结

    通过上一篇文章实例的实现,整个过程当中学习到很多知识点,了解了Jquery.Ajax在asp.net中的运用,加以总结,其实原理都是一样的,理解了一种,其他的注意很少的区别就可以了.灵活运用: 1.有 ...

随机推荐

  1. 开源消息中间件DotNetMQ

    由于这个开源项目对我这种中间件菜鸟很有帮助,因此,我将官方的说明文档翻译如下: Introduction In this article, I will introduce a new and ind ...

  2. RSA 非对称加密 数字签名 数字证书

    什么是RSA加密算法 RSA加密算法是一种非对称加密算法,算法的数学基础是极大数分解难题. RSA加密算法的强度也就是极大数分解的难度,目前700多位(二进制)的数字已经可以破解,1024位认为是比较 ...

  3. Java基础知识强化27：Object类之toString()方法

    1. Object类的toString()方法: public  String  toString():返回该对象的字符串表示 2. 案例演示: (1)Student类: package cn.itc ...

  4. Matcher Pattern 正则表达式 示例

    示例 public class Test {     public static void main(String[] args) throws IOException {         Patte ...

  5. bash:ifconfig command not found for contos7.0

    CentOS7刚发布,我忍不住把DELL T410从CentOS6升级到CentOS7.好不容易等安装结束后,立即配置网络,然后在yum源上安装环境.可是执行ifconfig的时候系统提示让我傻了眼: ...

  6. php遍历数据库

    数据库 <?php mysql_connect("localhost","root",""); mysql_set_charset(& ...

  7. Debian、Ubuntu常用命令大全

    注:本人是用的Debian,个别命令可能有问题. 原文:http://www.jb51.net/os/Ubuntu/56362.html 一.文件/文件夹管理 ls 列出当前目录文件(不包括隐含文件) ...

  8. sublime在Mac osx下安装z-codeing(即emmet)

    sublime安装插件可以根据插件名称通过package control就可以很方便的安装好.但是sublime没有默认安装package control,所以我们必须先安装它. 安装package ...

  9. python中的列表和字典

    列表和字典的区别: 列表是有序排列的一些物件,而字典是将一些物件(键)对应到另外一些物件(值)的数据结构; 应用场景: 字典 各种需要通过某个值去查看另一个值的场合,也就是一个虚拟的“查询表”,实现方 ...

  10. 关于Cococs中的CCActionEase（中）

    相比之前的速度正弦变化动作(这个东西叫什么更好一些?渐变动画?)与速度指数级变化动作,CCEaseIn/CCEaseOut/CCEaseInOut更具灵活性.你可以设置运动的速率,甚至是在运动的过程中 ...