jQuery如何将图像源存储到临时内存中并稍后检索答案

【问题标题】：jQuery how to store images source into a temporary memory and retrieve it laterjQuery如何将图像源存储到临时内存中并稍后检索
【发布时间】：2017-03-21 22:23:17
【问题描述】：

请查看下图。

当我点击隐藏图片时，所有图片显示替换为静态图片，稍后当我取消选中它时，它现在必须显示原始图片。

<div id="log_contents">    
    <span style="color:blue;"><b>Public chat</b> with <b>dragos123</b></span> <br><br>    
    <div class="chat-line"> 
        <span class="dialogue_time">  11:00:39 AM &nbsp;</span>
        <span style="background-color:FFF;">debasish:</span>
        <span style="background-color:FFF;"><img  style="cursor:pointer; max-height:80px;" src="http://localhost/myshowcam/files/stickers/msc-1427684408.gif" title=":party1"></span>
    </div>

    <div class="chat-line"> 
        <span class="dialogue_time">  11:01:43 AM &nbsp;</span>
        <span style="background-color:ffff88;">pkk:</span>
        <span style="background-color:ffff88;">hiiiiiiiiiiiiii</span>
    </div>

    <div class="chat-line"> 
        <span class="dialogue_time">  11:02:03 AM &nbsp;</span>
        <span style="background-color:ffff88;">pkk:</span>
        <span style="background-color:ffff88;"><img  style="cursor:pointer; max-height:80px;" src="http://localhost/myshowcam/files/stickers/msc-1427684892.gif" title=":1min"></span>
    </div><div class="pagination" style=""></div>

</div>

请提供您宝贵的反馈意见。

谢谢。

【问题讨论】：

那么剩下的代码在哪里？
我们需要更多信息。
所以你知道如何更改图像，并且想知道如何再次更改它？
为什么人们会胡闹而不是提供答案？ Paradeepta，你不能那样做。只需保存旧数据 vs data-* 属性。然后将其恢复为旧值。
欢迎来到 Stackoverflow Pradeepta。请包括您迄今为止尝试过的内容，以便人们可以帮助您。这是一个帮助人们的网站，而不是为他们工作的网站。如果您提出的问题并没有表明您自己试图实现自己的目标，那么您可能会发现一些敌意。

标签： javascript jquery local-storage

【解决方案1】：

您需要将有关原始值的信息保存在某处，否则将无法恢复此更改。

我会将初始代码更改为类似

$("#log_contents").find('img').each(function() {
    $(this).data('img-org', $(this).attr('src'));
    $(this).attr('src', 'img/hide-image.gif');
});

要反转它，你只需要做相反的事情

$("#log_contents").find('img').each(function() {
    $(this).attr('src', $(this).data('img-org'));
});

【讨论】：

该死的你哪里更快...删除了我的答案，因为它是重复的

【解决方案2】：

您可以使用一些属性来存储原始图像源。它不是有效的 HTML，但它应该可以工作。

编辑：@Kami 对data() 的回答更好，所以我改变了我的：

function change(element){
  if($(element).prop('checked')){  
    $("img").each(function() {
      $(this).data("old-src", $(this).attr("src"));  
    });
    $('img').attr("src", 'http://img005.lazygirls.info/people/tamanna_bhatia/tamanna_bhatia_tamanna_latest_images_7_jpg_jpeg_image_1024_1226_pixels_scaled_76__qWkMn2nO.sized.jpg');
  } else {
    $("img").each(function() {
      $(this).attr("src", $(this).data("old-src"));
    });
  }
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<img src="http://www.online-image-editor.com/styles/2013/images/example_image.png" /><br />
<img src="http://www.britishlegion.org.uk/ImageGen.ashx?width=800&image=/media/2019101/id23055-normandy-66th_-schools-visit-poppy-choice_-pupils-from-london-city-academy.jpg" /><br />
<input type="checkbox" onclick="change(this)" /> Images off!

【讨论】：