在公司的图片服务器中,同一个产品一般会存在对应的大图和缩略图.因此,我们在开发手机端的web网站时,默认使用的是产品图片的缩略图,查询数据库时获取的是缩略图的路径.但是,不知什么原因,时不时的,测试的同事总会找到我们,说产品图片没显示出来,是个bug,需要修改.

那么,问题来了.

(1)PHP后台如何判断远程服务器上的图片是否存在

解决思路:获取图片路径-->对图片是否存在进行判断-->不存在,使用大图

/**
* @desc 检查远程图片是否存在
* @param string $url 图片远程地址
* @return boolean $found 存在为true,否则false
*/
function check_remote_file_exists($url) {
//curl初始化
$curl = curl_init($url);
//不取回数据
curl_setopt($curl, CURLOPT_NOBODY, true);
//发送请求,接收结果
$result = curl_exec($curl);
$found = false;
if ($result !== false) {
//检查http响应码是否为200
$statusCode = curl_getinfo($curl, CURLINFO_HTTP_CODE);
if ($statusCode == 200) {
$found = true;
}
}
//关闭curl资源
curl_close($curl);
//返回结果
return $found;
}
$url='http://home.baidu.com/resource/r/home/img/logo-yy.gif';
$error_url='http://home.baidu.com/resource/r/home/img/logo-yy111111.gif';
var_dump(check_remote_file_exists($url));
echo '<br />';
var_dump(check_remote_file_exists($error_url));
/*
以上例子输出:
bool(true)
bool(false)
*/
可以看出,PHP中CURL系列函数还是很强大的.
在百度时,我还发现了说使用fopen()函数进行判断的,但是经实验,未能实现相应功能.举例如下:
 $url='http://home.baidu.com/resource/r/home/img/logo-yy.gif';
$error_url='http://home.baidu.com/resource/r/home/img/logo-yy111111.gif'; if( @fopen( $error_url, 'r' ) )
{
echo 'File Exits';
}
else
{
echo 'File Do Not Exits';
}
/*
以上例子输出:File Exits
*/
(2)前端jquery中使用load事件对图片的处理
进一步思考,前端使用jquery能否判断远程图片是否存在呢?遗憾的是,在写作本文时,未能找到判断的方法.
我们知道,如果一张图片不存在的话,img标签会默认显示一个撕裂的小图案,客户体验非常不友好,我们可以使用jquery中的load事件(图片加载完时触发)对图片进行处理.
思路:先将全部图片隐藏-->为img标签添加load事件-->图片加载完成,显示图片
示例如下:
注意:引入jquery.js
 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>load event</title>
<script language="javascript" src="jquery.js"></script>
</head>
<body>
<img src="http://home.baidu.com/resource/r/home/img/logo-yy.gif" alt="" id='test'/>
</body>
<script>
//jquery load event test
//var h=$('#test').height();
//document.write(h);
$('img').each(function(){
//先隐藏图片
$(this).hide();
//监听load事件
$(this).bind('load',function(){
//加载完成,显示图片
$(this).show();
});
});
</script>
</html>
使用load事件时,有两点需要注意:
第一,load事件和当前jquery代码执行顺序是异步的,
第二,$(document).ready()指的是html代码加载完成,load事件指的是请求的图片下载完成.

 如果img标签没被设定width和height,默认没加载完成时img的宽高为0,即width=height=0,利用这个特性,我们可以对img标签进行进一步的处理,例如:

PHP判断图片是否存在和jquery中load事件对图片的处理的更多相关文章

  1. jQuery中的事件和动画——《锋利的jQuery》(第2版)读书笔记2

    第4章 jQuery中的事件和动画 jQuery中的事件 加载DOM $(document).ready(function(){   // 编写代码... }); 可以简写成: $(function( ...

  2. 【jQuery基础学习】03 jQuery中的事件与动画

    关于jQuery中的事件 js与HTML之间的交互是通过用户和浏览器操作页面时引发的事件来处理的. jQuery增加并扩展了基本的事件处理机制,jQuery不仅提供了更加优雅的事件处理方法,而且极大地 ...

  3. jQuery:详解jQuery中的事件(二)

    上一篇讲到jQuery中的事件,深入学习了加载DOM和事件绑定的相关知识,这篇主要深入讨论jQuery事件中的合成事件.事件冒泡和事件移除等内容. 接上篇jQuery:详解jQuery中的事件(一) ...

  4. jQuery:详解jQuery中的事件(一)

    之前用过一些jQuery的动画和特效,但是用到的部分也不超过10%的样子,感觉好浪费啊——当然浪费的不是jQuery,而是Web资源.后来就想深入研究下jQuery的内部机理,读过两遍jQuery源代 ...

  5. jQuery中的事件与动画 (你的明天Via Via)

    众所周知,页面在加载时,会触发load事件:当用户单击某个按钮时,会触发该按钮的click事件. 这些事件就像日常生活中,人们按下开关,灯就亮了(或者灭了),往游戏机里投入游戏币就可以启动游戏一样, ...

  6. Jquery中的事件和动画

    在学习Jquery中的过程中我们绝大部分都用到了事件的操作,也可以说事件是Jquery中必不可少的一部分,我们常见的一些事件有单击事件,鼠标事件,键盘事件等等.在Jquery中的学习中为了能使让页面以 ...

  7. Jquery:Jquery中的事件<一>

    由于今天有一个比较重要的面试,所以昨天晚上对以前做的一些项目做了一下总结,直接导致昨天的学习笔记断更了,哎,计划永远赶不上变化啊!今天学习了Jquery中是事件,就此做一个笔记,便于日后复习. 一.加 ...

  8. JQuery中的事件委托

    JQuery 中的事件委托 定义 事件委托就是利用冒泡的原理,把事件加到父级上,通过判断事件来源的子集,执行相应的操作,事件委托首先可以极大减少事件绑定次数,提高性能:其次可以让新元素的子元素也可以拥 ...

  9. jQuery中绑定事件的几种方法

    以click事件为例,jQuery中绑定事件有三种方法: (1)target.click(function(){});  (2)target.bind("click",functi ...

随机推荐

  1. HTML5 canvas 绘制精美的图形

    HTML5 是一个新兴标准,它正在以越来越快的速度替代久经考验的 HTML4.HTML5 是一个 W3C “工作草案” — 意味着它仍然处于开发阶段 — 它包含丰富的元素和属性,它们都支持现行的 HT ...

  2. iOS开发之基于parse的登录注册

    基本上现在的每一款app都有登录功能.那也就少不了注册,找回密码等操作. 今天要说的就是初学者可以使用parse做为后台的服务器来进行一系列的操作,等以后工作的时候可以用公司的服务器. 注册用户 Bm ...

  3. Android ImageView图片自适应

    网络上下载下来的图片自适应:android:adjustViewBounds="true"(其详细解释在下面) <ImageView     android:id=" ...

  4. Weka回归

    第一个数据挖掘技术:回归 例子:给房子定价 房子的价格(因变量)是很多自变量 — 房子的面积.占地的大小.厨房是否有花岗石以及卫生间是否刚重装过等的结果.所以,不管是购买过一个房子还是销售过一个房子, ...

  5. int指令(软件中断指令)

    INT(软件中断指令)是CALL指令的一种特殊形式.call指令调用调用的子程序是用户程序的一部分,而INT指令调用的操作系统提供的子程序或者其他特殊的子程序. 中断服务子程序和标准过程的最大区别是 ...

  6. VB中后台打开Excel文件实现代码

    某些时候需要打开Excel文件来获取或者写入数据,但又不希望跳出打开的Excel文件窗口,可以用下面的代码: Dim eb As New excel.Application, wb as excel. ...

  7. 修改vim默认tab为4个空格与显示行号

    添加一个.vimrc配置文件即可. 在home目录下 vim .vimrc # 添加如下内容 set ts=4 set expandtab set nu 然后再次用vim打开任意文件,就看见效果啦!

  8. Hibernate 命名查询NamedQuery (转)

    转自:http://blog.163.com/ksm19870304@126/blog/static/374552332011993942391/ 配置方式: static List namedQue ...

  9. Jdt Javax

    http://www.javablogging.com/dynamic-in-memory-compilation/ http://www.java2s.com/Code/Java/JDK-6/Com ...

  10. linux ssh 不用密码自动登录的几种方法

    1. 自动ssh/scp方法== A为本地主机(即用于控制其他主机的机器) ;B为远程主机(即被控制的机器Server), 假如ip为192.168.60.110;A和B的系统都是Linux 在A上运 ...