需求分析:

实现对网页上的图片进行显示。由于读取图片名称相同,而图片内容已发生改变。采用网上所用的要求浏览器不缓存的操作不生效

<META http-equiv="Pragma" CONTENT="no-cache">
<META http-equiv="Cache-Control" CONTENT="no-cache, must-revalidate">
<META http-equiv="expires" CONTENT="0">
<meta charset="utf-8">
<META HTTP-EQUIV="expires" CONTENT="Wed, 26 Feb 1997 08:21:57 GMT">
<META HTTP-EQUIV="expires" CONTENT="0">

后面采用ajax的方式请求数据,直接从后端将图片内容读取并返回给前端,从而实现图片数据的最新显示

前端 ajax请求:

        $.ajax({
url: 'index.php',
type: 'POST',
dataType: 'json',
data: {mode: '<?=$Mode?>',id:'<?=$idVal;?>'},
})
.success(function(data){
// console.log(data);
$.each(data,function(name,value){
// console.log(name);
// console.log(value);
$("#sm_image"+name).attr("src","data:image/png;base64,"+value); }) })
.done(function(data) {
console.log("success");
// $("sm_image").attr("src","data:image/png;base64,"+data);
// echo
})
.fail(function(data) {
console.log(data);
console.log("error");
})
.always(function() {
console.log("complete");
});

后台php解析并返回:

<?php 

if($_POST) {

   switch ($_POST['mode']) {
case 1:
// print_r($_POST['id']);
$idArr = explode(",", $_POST['id']); $jsonStr = "{"; for ($i=0; $i <count($idArr) ; $i++) {
$img = base64_encode(file_get_contents("/web/image/image_id".$idArr[$i].".png"));
$jsonStr .= "\"".$idArr[$i]."\":\"$img\",";
} $jsonStr = substr($jsonStr,0,-1); $jsonStr .= "}";
echo $jsonStr;
break;
case 2:
$id = $_POST['id'];
$img = base64_encode(file_get_contents("/web/image/image_id".$id.".png"));
echo '{"'.$id.'":"'.$img.'"}'; //读取图片数据并作base64编码
break;
default:
break; } } ?>

ajax 请求多张图片数据的更多相关文章

  1. ajax请求获取的数据无法赋值给全局变量问题总结

    一.总结: 1.问题描述: 今天做项目遇到在用表单显示详细信息的过程中ajax请求获取的数据无法赋值给全局变量的情况,从列表页面进入详情页,在详情页面被渲染了之后就会调用js文件里的接口向服务器请求数 ...

  2. 在使用Ajax请求返回json数据的时候IE浏览器弹出下载保存对话框的解决方法

    在使用Ajax请求返回json数据的时候IE浏览器弹出下载保存对话框的解决方法 最近在做一个小东西,使用kindeditor上传图片的时候,自己写了一个上传的方法,按照协议规则通过ajax返回json ...

  3. ajax请求回数组数据,Vue页面数组没同步问题

    记录bug 为什么 ajax 获取到了 vm.$data.list 页面上却没有显示出来的? 代码 //页面 <tr v-for="item in list">{{ * ...

  4. React 中的 AJAX 请求:获取数据的方法

    React 中的 AJAX 请求:获取数据的方法 React 只是使用 props 和 state 两处的数据进行组件渲染. 因此,想要使用来自服务端的数据,必须将数据放入组件的 props 或 st ...

  5. 二、Ajax请求MVC中数据查询表返回datatable

    一.Ajax请求MVC中数据查询表返回datatable 解决方式 返回list

  6. Vue中使用echarts,ajax请求的远程数据赋值给图表不刷新的问题和解决办法

    问题: vue-cli搭建的项目,在mounted钩子函数里面创建echarts图表,本地模拟数据可以正常显示,但是当将ajax请求的远程数据赋值给图表时,图表并不会刷新. 解决办法: 刚开始以为是v ...

  7. SpringBoot入门07-Thymeleaf中显示ajax请求到的数据

    Thymeleaf中显示ajax请求所需依赖 <!--所需依赖--><dependency> <groupId>org.springframework.boot&l ...

  8. jQuery实现的分页功能,包括ajax请求,后台数据,有完整demo

    一:需求分析 1)需要首页,末页功能 2)有点击查看上一页,下一页功能 3)页码到当前可视页码最后一页刷新页面 二:功能实现思路 也是分为三部分处理 1)点击首页,末页直接显示第一页或者最后一页内容, ...

  9. jquery ajax请求成功,数据返回成功,seccess不执行的问题

    1.状态码返回200--表明服务器正常响应了客户端的请求:       2.通过firebug和IE的httpWatcher可以看出服务器端返回了正常的数据,并且是符合业务逻辑的数据.         ...

随机推荐

  1. jQuery ajax - serialize() 方法-输出序列化表单值

    定义和用法 serialize() 方法通过序列化表单值,创建 URL 编码文本字符串. 您可以选择一个或多个表单元素(比如 input 及/或 文本框),或者 form 元素本身. 序列化的值可在生 ...

  2. 11个强大的Visual Studio调试小技巧

    简介 调试是软件开发周期中很重要的一部分.它具有挑战性,同时也很让人疑惑和烦恼.总的来说,对于稍大一点的程序,调试是不可避免的.最近几年,调试工具的发展让很多调试任务变的越来越简单和省时. 这篇文章总 ...

  3. 关于markdown的学习

    标题 标题(一个等号) 小标题 深层标题 深层标题2 深层标题6 深层标题 左边一个空格 深层标题 左边两个空格 此处省略很多字 左边有回车 一个空格 两个空格 三个空格 十个空格 字体属性:斜体.加 ...

  4. 北京地铁站点遍历最少经站次数问题普遍意义上是一个NP问题,目前不存在多项式时间算法能够解决该问题

    http://www.cnblogs.com/jiel/p/5852591.html 众所周知求一个图的哈密顿回路是一个NPC问题: In the mathematical field of grap ...

  5. Linux 内核高-低端内存设置代码跟踪(ARM构架)

    对于ARM中内核如何在启动的时候设置高低端内存的分界线(也是逻辑地址与虚拟地址分界线(虚拟地址)减去那个固定的偏移),这里我稍微引导下(内核分析使用Linux-3.0): 首先定位设置内核虚拟地址起始 ...

  6. LightOj1089(求点包含几个线段 + 线段树)

    题目链接 题意:n( n <= 50000 ) 个线段,q ( q <= 50000) 个点,问每个点在几个线段上 线段端点的和询问的点的值都很大,所以必须离散化 第一种解法:先把所有的线 ...

  7. photoshop工具使用的简单介绍

    photoshop工具使用的简单介绍 我所用PhotoShop版本号是cs6,这里对其主要功能做一个简单介绍. 第一部分: 首先,ps的界面主要分为了6部分: 一.最上面的一行的菜单栏,菜单中有:文件 ...

  8. RequestDemo01

    package com.etc.requestdemo; import java.io.IOException;import java.io.PrintWriter; import javax.ser ...

  9. 9.19 JS数组

    数组:相同类型数据的集合强类型语言:1数组里面只能存放相同数据类型的数据     2定义数组的时候需要制定一个长度(可以存放的元素数量)     3内存空间连续集合:1.可以存放任意类型的数据     ...

  10. 如果将CTE 用在属于批处理的一部分的语句中

    declare @s nvarchar(3) set @s = 'C%' ; -- 必须加分号with t_tree as ( select CountryRegionCode from person ...