啊打发

  <script type="text/javascript" src="js/jquery-1.8.3.min.js"></script>

    <script type="text/javascript">

        $(function(){

            //点击按钮异步加载数据，并在content中显示

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

                /**** $.ajax()方法  ***

//                $.ajax({

//                    url: "data.json",//"发送的请求地址",

//                    type:"get",//"请求方式"

//                    data:null,//"要发送的数据",

//                    dataType: "json",

//                    beforeSend: function(data) { // 发送请求前执行的代码

//                        $(".loading").show();

//                    },

//                    success: function(data) {// 发送成功后执行的代码

//                        dealData(data);

//                    },

//                    complete:function(){

//                        $(".loading").hide();

//                    },

//                    error: function(XMLHttpRequest, textStatus, errorThrown) {// 请求失败执行的代码

//                        alert("错误信息:"+textStatus);

//                    }

//                 });

//

                /****  $.getJSON()方法  ****/

//                $.getJSON("data.json",function(data){

//                    dealData(data);

//                })

                /****  $.get()方法   ****/

//                $.get("data.json",{},function(data){

//                    dealData(data);

//                },"json");

                /****  $.post()方法  ****/

                $.post("data.json",{},function(data){

                    dealData(data);

                },"json")

            });

            function dealData(data){

                if(typeof data != "undefined"){

                    $(data.news).each(function(i){

                        $("#newsList").append("<li><a href='#id="+data.news[i].id+"'>"+data.news[i].title+"["+data.news[i].date+"]</a></li>")

                    });

                }

            }

        });

    </script>
<body>

<div id="newsBox">

    <div class="top">新闻列表</div>

    <ul id="newsList">

        <li><a href="#">新闻标题1[11-27]</a></li></li>

        <li><a href="#">新闻标题2[11-23]</a></li></li>

        <li><a href="#">新闻标题3[11-23]</a></li></li>

        <li><a href="#">新闻标题4[11-18]</a></li></li>

        <li><a href="#">新闻标题5[11-11]</a></li></li>

        <li class="loading hidden" style="display: none">loading..</li>

    </ul>

    <div id="btn">查看更多</div>

实现ajax的更多相关文章

  1. jQuery之ajax实现篇

    jQuery的ajax方法非常好用,这么好的东西,你想拥有一个属于自己的ajax么?接下来,我们来自己做一个简单的ajax吧. 实现功能 由于jq中的ajax方法是用了内置的deferred模块,是P ...

  2. Ajax及跨域

    概念 Ajax Ajax,Asynchronous JavaScript and XML,字面意思:异步的 JavaScript 和 XML,是指一种创建交互式网页应用的网页开发技术. 用于异步地去获 ...

  3. 一个粗心的Bug，JSON格式不规范导致AJAX错误

    一.事件回放  今天工作时碰到了一个奇怪的问题,这个问题很早很早以前也碰到过,不过没想到过这么久了竟然又栽在这里. 当时正在联调一个项目,由于后端没有提供数据接口,于是我直接本地建立了一个 json ...

  4. ABP文档 - Javascript Api - AJAX

    本节内容: AJAX操作相关问题 ABP的方式 AJAX 返回信息 处理错误 HTTP 状态码 WrapResult和DontWrapResult特性 Asp.net Mvc 控制器 Asp.net ...

  5. ajax异步请求

    做前端开发的朋友对于ajax异步更新一定印象深刻,作为刚入坑的小白,今天就和大家一起聊聊关于ajax异步请求的那点事.既然是ajax就少不了jQuery的知识,推荐大家访问www.w3school.c ...

  6. 调用AJAX做登陆和注册

    先建立一个页面来检测一下我们建立的用户名能不能用,看一下有没有已经存在的用户名吗 可以通过ajax提示一下 $("#uid").blur(function(){ //取用户名 va ...

  7. Ajax 概念 分析 举例

    Ajax是结合了访问数据库,数据访问,Jquery 可以做页面局部刷新或者说是页面不刷新,我可以让页面不刷新,仅仅是数据的刷新,没有频繁的刷页面,是现在比较常用的一种方式做页面那么它是怎么实现页面无刷 ...

  8. ajax

    常见的HTTP状态码状态码:200 请求成功.一般用于GET和POST方法 OK301 资源移动.所请求资源移动到新的URL,浏览器自动跳转到新的URL Moved Permanently304 未修 ...

  9. 学习笔记之MVC级联及Ajax操作

    由于刚转型到MVC,MVC的架构模式很多不是很清楚,比如今天就想做个级联的操作,因为之前的ASP.NET的方式是通过:控件-->添加事件-->后台编写级联事件进行触发,但是这个MVC就不同 ...

  10. javascript表单的Ajax 提交插件的使用

    Ajax 提交插件 form.js 表单的下载地址:官方网站:http://malsup.com/jquery/form/ form.js 插件有两个核心方法:ajaxForm()和ajaxSubmi ...

随机推荐

  1. 用 eric6 与 PyQt5 实现python的极速GUI编程（系列01）--Hello world!

    [题记] 我是一个菜鸟,这个系列是我的学习笔记. PyQt5 出来有一段时间了, PyQt5 较之 PyQt4 有一些变化,而网上流传的几乎都是 PyQt4 的教程,照搬的话大多会出错. eric6 ...

  2. 【超详细教程】使用Windows Live Writer 2012和Office Word 2013 发布

    去年就知道有这个功能,不过没去深究总结过,最近有写网络博客的欲望了,于是又重新拾起这玩意儿. 具体到底是用Windows Live Writer 2012还是用Word 2013,个人觉得看个人,因为 ...

  3. Win7上防火墙开放FTP服务以及ping解决方案（zz）

    1.windows 防火墙开放ftp服务 The following 4 steps will allow both non-secure and SSL FTP traffic through fi ...

  4. 信息安全系统设计第二次&第四次实验

    实验二 固件设计  实验步骤: 环境配置如同实验一,承接实验一. 1.在虚拟机中编译代码.对于多线程相关的代码,编译时需要加-lpthread 的库. 2.下载调试在超级终端中运行可执行文件 pthr ...

  5. 深入JVM系列之(3):JavaCore和HeapDump

    jvm 生成javacore和heapdump文件 在Server端开发与运维中,经常需要生成javacore和heapdump文件,以便分析jvm的运行状态.javacore文件中给出jvm线程的详 ...

  6. C#中的yield return与Unity中的Coroutine（协程）（上）

    C#中的yield return C#语法中有个特别的关键字yield, 它是干什么用的呢? 来看看专业的解释: yield 是在迭代器块中用于向枚举数对象提供值或发出迭代结束信号.它的形式为下列之一 ...

  7. sqlserver日期函数 dateadd,datediff ,datepart ,datename,convert

    reference:http://www.cnblogs.com/coconut_zhang/archive/2009/02/02/1382598.html http://blog.itpub.net ...

  8. android之显示数据库信息

    关键字 ListView adapter MVC 在android开发中也使用到了MVC架构,其中的xml布局文件就是V,M就是我们定义好的javabean类,而控制器就是就是适配器类adapter ...

  9. 第十四章 校本化CSS

    CSS(层叠样式表)是一种指定HTML文档视觉的表现的标准.CSS本来是让视觉设计师来使用的:它允许设计师精确的对文档元素的字体 ,颜色,外边距,缩进,边框甚至是定位.不过,客户端javascript ...

  10. 2012杀毒软件排行榜TOP10强

    2012杀毒软件排行榜TOP10强 1:avast!杀毒软件       来自捷克的avast!,已有数十年的历史,它在国外市场一直处于领先地位.avast!分为家庭版.专业版.家庭网络特别版.和服务 ...