ajax 加载不同数据
<!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 加载不同数据的更多相关文章
- C#曲线分析平台的制作(四,highcharts+ajax加载后台数据)
在上一篇博客:C#曲线分析平台的制作(三,三层构架+echarts显示)中已经完成了后台的三层构架的简单搭建,为实现后面的拓展应用开发和review 改写提供了方便.而在曲线分析平台中,往往有要求时间 ...
- vue通过ajax加载json数据
HTML <ul id="Hanapp"> <li class="styVue" v-for="item in actList&qu ...
- ajax加载表格数据
一.html代码 <style type="text/css"> .table-taskinfo table tr { border-top: 2px solid #9 ...
- ztree通过ajax加载json数据中文乱码的解决方法:springmvc配置
一.问题描述 使用zTree的异步刷新父级菜单时,服务器返回中文乱码,但项目中使用了SpringMvc,已经对中文乱码处理,为什么还会出现呢? 此处为的异步请求的配置: async: { enable ...
- jQuery.ajax( options ) : 通过 HTTP 请求加载远程数据
jQuery.ajax( options ) : 通过 HTTP 请求加载远程数据 这个是jQuery 的底层 AJAX 实现.简单易用的高层实现见 $.get, $.post 等. $.ajax() ...
- ajax验证表单元素规范正确与否 ajax展示加载数据库数据 ajax三级联动
一.ajax验证表单元素规范正确与否 以用ajax来验证用户名是否被占用为例 1创建表单元素<input type="text" id="t"> 2 ...
- 使用ajax()方法加载服务器数据
使用ajax()方法加载服务器数据 使用ajax()方法是最底层.功能最强大的请求服务器数据的方法,它不仅可以获取服务器返回的数据,还能向服务器发送请求并传递数值,它的调用格式如下: jQuery.a ...
- 一起学爬虫——如何爬取通过ajax加载数据的网站
目前很多网站都使用ajax技术动态加载数据,和常规的网站不一样,数据时动态加载的,如果我们使用常规的方法爬取网页,得到的只是一堆html代码,没有任何的数据. 请看下面的代码: url = 'http ...
- ajax点击加载更多数据图片(预加载)
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
随机推荐
- [HIHO1223]不等式(离散化,枚举)
题目链接:http://hihocoder.com/problemset/problem/1223 这题不难,难点在于小数的处理.可以0.5为步长枚举,也可以扩大偶数倍枚举. /* ━━━━━┒ギリギ ...
- laravel创建新model数据的两种方法
laravel中的CRUD操作中,通过对代表数据表中row的model对象操作,来更新数据库表. 对于创建新的row的操作,有两种功能上相同的方法: 1.create: $user = User::c ...
- PHP的模板引擎这点事儿
什么是模板引擎? 为什么要使用它? 为什么要assign一个变量给模板? https://dbforch.wordpress.com/2010/06/26/the-logic-behind-templ ...
- link cut tree 入门
鉴于最近写bzoj还有51nod都出现写不动的现象,决定学习一波厉害的算法/数据结构. link cut tree:研究popoqqq那个神ppt. bzoj1036:维护access操作就可以了. ...
- Codeforces 279 B Books
题意:给出n本书,总的时间t,每本书的阅读时间a[i],必须按照顺序来阅读,问最多能够阅读多少本书 有点像紫书的第七章讲的那个滑动区间貌似 维护一个区间的消耗的时间小于等于t,然后维护一个区间的最大值 ...
- Asp.Net正则获取页面a标签里的内容
Asp.Net正则获取页面a标签里的内容 string url = "http://www.114369.com"; string html = MyCLib.NetClass.S ...
- 13行代碼開發出来的PHP框架[转]
<?PHP /** PHP極簡框架 交流: QQ群: 223494678 http://7di.net 用法 http://URL http://URL/hello http://URL/sev ...
- java动态代理复习
package com.free.testProxy; import java.lang.reflect.InvocationHandler; import java.lang.reflect.Met ...
- (六)6.7 Neurons Networks whitening
PCA的过程结束后,还有一个与之相关的预处理步骤,白化(whitening) 对于输入数据之间有很强的相关性,所以用于训练数据是有很大冗余的,白化的作用就是降低输入数据的冗余,通过白化可以达到(1)降 ...
- replicate-do-db参数引起的MySQL复制错误及处理办法
replicate-do-db配置在MySQL从库的my.cnf文件中,可以指定只复制哪个库的数据.但是这个参数有个问题就是主库如果在其他的schema环境下操作,其binlog不会被从库应用,从而出 ...