zoukankan      html  css  js  c++  java
  • JQ-第一次点击改变图片,再次点击恢复原本图片//下载图片到本地(移动端下载是ZIP)

     1  <!-- 点赞、下载 -->

    <div style="background-color: #fff; 100%;height: 26px;margin: 5px 0;"> 2 3 <p style=" 50%;float: left;border-right: 1px solid #eee; margin:0;height: 26px;"> 4 <a href="javascript:;" style='display: block; 53px;margin-left: 32%; 5 position: relative;' onclick="zan(this,{$item['id']})"> 6 <img src="../images/F_zan_03.png" data="{$item['id']}" alt="" style=" 26px; 7 position: absolute;left: 0;top: -2px;" id="imgZan{$item['id']}"> 8 <!-- <img src="../images/F_zan_03_2.png" alt="" style=" 26px;display: none; 9 position: absolute;left: 0;top: -2px;"" class="afterZan"> --> 10 <span style="color:#000;line-height: 26px;font-size: 16px;margin-left: 26px;">20</span> 11 </a> 12 13 </p> 14 15 16 <a href="{php echo $this->createMobileUrl('find', array('op' => 'down' , 'id' => $item['id']))}" style="display: block; 17 50%; 18 float: right; 19 height: 26px;" onclick="downloadIamge('.saveImg','')"> 20 <img src="../images/F_load_03.png" alt="" style=" 22px; margin-left: 30%;margin-top: -5px;"> 21 <span style="color:#000;line-height: 26px;font-size: 15px;">下载</span> 22 </a> 23 </div>


     1 <script>
     2 
     3         // 切换点赞图片  
     4         function zan(obj,id){
     5 
     6              if($(obj).children().attr("src") == "../images/F_zan_03.png"){
     7                 $(obj).children().attr("src","../images/F_zan_03_2.png");
     8             }else{
     9                 $(obj).children().attr("src","../images/F_zan_03.png");
    10             }
    11             
    12         }
    13 
    14 
    15 
    16         // 下载图片
    17         (function(){
    18              $(".tjImg p img").attr("class","saveImg")
    19         })() 
    20         function downloadIamge(selector, name) {
    21             // 通过选择器获取img元素,  
    22             var img = document.querySelector(".saveImg")  
    23             // 将图片的src属性作为URL地址  
    24             var url = img.src  
    25             var a = document.createElement('a')  
    26             var event = new MouseEvent('click')  
    27               
    28             a.download = name || '下载图片名称'   
    29             a.href = url  
    30               
    31             a.dispatchEvent(event)  
    32             console.log("src:",url,"selector:")
    33         }  
    34           
    35 </script>

     

  • 相关阅读:
    发现CSDN的一个小Bug,CSDN网站管理人员进来看看哈~~
    “凡客好声音”摇滚派对专场 正火热抢票中!
    帧动画
    java WEB Response重定向和缓存控制
    上一篇括号配对让人联想起catalan数,顺便转载一篇归纳的还不错的文章
    字符串循环移位
    应用层协议实现系列(三)——FTPserver之设计与实现
    HDU1575-Tr A(矩阵高速幂)
    音视频即时通讯的分包与重组
    怎样批量重命名照片,可是去掉那个烦人的括号
  • 原文地址:https://www.cnblogs.com/llying/p/9642629.html
Copyright © 2011-2022 走看看