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>

     

  • 相关阅读:
    SQL Server 2005中NTEXT与NVARCHAR(MAX)
    WiX安装选项开始菜单项
    Linq to SQL 查询Tips
    WCF的Message Logging 和Tracing
    Publish Server Performance Monitors with MsChart
    Pushing Data to a Silverlight Client with a WCF Duplex Service
    IronPython 2.0 发布了
    设置系统环境变量立即生效的VBS脚本
    微软网络数据包分析工具 Microsoft Network Monitor 3.2
    SQL Server 2005最新Service Pack 3
  • 原文地址:https://www.cnblogs.com/llying/p/9642629.html
Copyright © 2011-2022 走看看