<!doctype html>

<html>

<head>

<meta charset="utf-8">

<title>无标题文档</title>

<script>

function fn1 (data)

{

    var oul1 = document.getElementById('ul1');

    var html = '';

    for(var i = 0; i < data.length; i++)

    {

        html += '<li>'+ data[i] +'</li>'

    }

    oul1.innerHTML = html;

}

function fn2 (data)

{

    var oul2 = document.getElementById('ul2');

    var html = '';

    for(var i = 0; i < data.length; i++)

    {

        html += '<li>'+ data[i] +'</li>'

    }

    oul2.innerHTML = html;

}

function fn3 (data)

{

    var oul3 = document.getElementById('ul3');

    var html = '';

    for(var i = 0; i < data.length; i++)

    {

        html += '<li>'+ data[i] +'</li>'

    }

    oul3.innerHTML = html;

}

window.onload = function ()

{

    var obtn1 = document.getElementById('btn1');

    var oul1 = document.getElementById('ul1');

    obtn1.onclick = function ()

    {

        var oscript = document.createElement('script');

        oscript.src = 'getData.php?callback=fn1';

        document.body.appendChild(oscript);

    }

    var obtn2 = document.getElementById('btn2');

    var oul2 = document.getElementById('ul2');

    obtn2.onclick = function ()

    {

        var oscript = document.createElement('script');

        oscript.src = 'getData.php?t=str&callback=fn2';

        document.body.appendChild(oscript);

    }

    var obtn3 = document.getElementById('btn3');

    var oul3 = document.getElementById('ul3');

    obtn3.onclick = function ()

    {

        var oscript = document.createElement('script');

        oscript.src = 'getData.php?t=str&callback=fn3';

        document.body.appendChild(oscript);

    }

}

</script>

</head>

<body>

    <input type="button" id="btn1" value="加载数字">

    <ul id="ul1"></ul>

    <input type="button" id="btn2" value="加载字母" />

    <ul id="ul2"></ul>

    <input type="button" id="btn3" value="加载字母" />

    <ul id="ul3"></ul>

</body>

</html>
<?php

$t = isset($_GET['t']) ? $_GET['t'] : 'num';

$callback = isset($_GET['callback']) ? $_GET['callback'] : 'fn1';

$arr1 = array('111111','22222222','33333333','4444444','555555555555555555555');

$arr2 = array('aaaaaaaaaaaa','bbbbbbbb','cccccccccccc','ddddddddd','eeeeeeeeeeee');

if ($t == 'num') {

    $data = json_encode($arr1);

} else {

    $data = json_encode($arr2);

}

echo $callback.'('.$data.');';

ajax 加载不同数据的更多相关文章

  1. C#曲线分析平台的制作（四，highcharts+ajax加载后台数据）

    在上一篇博客:C#曲线分析平台的制作(三,三层构架+echarts显示)中已经完成了后台的三层构架的简单搭建,为实现后面的拓展应用开发和review 改写提供了方便.而在曲线分析平台中,往往有要求时间 ...

  2. vue通过ajax加载json数据

    HTML <ul id="Hanapp"> <li class="styVue" v-for="item in actList&qu ...

  3. ajax加载表格数据

    一.html代码 <style type="text/css"> .table-taskinfo table tr { border-top: 2px solid #9 ...

  4. ztree通过ajax加载json数据中文乱码的解决方法:springmvc配置

    一.问题描述 使用zTree的异步刷新父级菜单时,服务器返回中文乱码,但项目中使用了SpringMvc,已经对中文乱码处理,为什么还会出现呢? 此处为的异步请求的配置: async: { enable ...

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

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

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

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

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

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

  8. 一起学爬虫——如何爬取通过ajax加载数据的网站

    目前很多网站都使用ajax技术动态加载数据,和常规的网站不一样,数据时动态加载的,如果我们使用常规的方法爬取网页,得到的只是一堆html代码,没有任何的数据. 请看下面的代码: url = 'http ...

  9. ajax点击加载更多数据图片（预加载）

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

随机推荐

  1. BZOJ 1878 HH的项链（树状数组）

    题目链接:http://61.187.179.132/JudgeOnline/problem.php?id=1878 题意:给出一个数列,每次询问区间[L,R]中有多少个不同的数字? 思路: (1)记 ...

  2. 细说：Unicode, UTF-8, UTF-16, UTF-32, UCS-2, UCS-4

    1. Unicode与ISO 10646 全世界很多个国家都在为自己的文字编码,并且互不想通,不同的语言字符编码值相同却代表不同的符号(例如:韩文编码EUC-KR中“한국어”的编码值正好是汉字编码GB ...

  3. git大文件管理

    由于git在每一个commit时都会变动过的文件全部保存(不像其他的系统,只做文件增量存储),外加未变动文件的引用,这样如果在文件系统中有一些大的二进制文件,比如图片,视频,那么很快你的repo就将变 ...

  4. github概念和实战

    fork: 通过fork操作,你将拥有了别人创建的repo的ownership,但是url却变成了/youraccount/repo,这时你将可以做git push操作 clone: 该命令是直接将r ...

  5. hdu4605 magic ball game 树状数组+离线处理

    题意:给你一棵二叉树,每个节点有一个w值,现在有一颗小球,值为x,从根节点往下掉,如果w==x,那么它就会停止:如果w>x,那么它往左.右儿子的概率都是1.2:如果w<x,那么它往左儿子的 ...

  6. 【同行说技术】Android图片处理技术资料汇总（一）

    对于Android开发的童鞋们来说,图片处理时或多或少都会遇到令人头疼和不满意的问题,今天小编收集了5篇Android图片处理的干货文章,一起来看看吧! 一.Android 高清加载巨图方案 拒绝压缩 ...

  7. BZOJ 1078 斜堆

    感谢MATO大神的博客 http://www.cppblog.com/MatoNo1/archive/2013/03/03/192131.html 注意细节. #include<iostream ...

  8. 【英语】Bingo口语笔记(23) - 万圣节系列

    jack-o-lantern 杰克灯(南瓜灯) spooky 幽灵般的

  9. Oracle 11g对大表中添加DEFAULT值的NOT NULL字段速度有大幅度的提升

    在一张2000万的表上增加了一个字段并字段一个默认值,执行这条语句(alter table tablename add new_col default ‘col’)一个小时没有执行完,问我有没有其他解 ...

  10. Web开发基础

    一.后台 1.MyEclipse:Java Web的编辑器 2.Java Servlet:后台代码 3.Velocity:前后台接口 4.mySql:数据库 二.前台 1.js:前台代码 2.jQue ...