Php 为什么刷新页面后不检索Img？

我想在本地存储html5中存储多个动态图像，并在页面刷新时检索

这是我的代码和JSFIDLE

HTML

<ul class="lib">
    <li>
        <img class='my_image' src='http://wcdn1.dataknet.com/static/resources/icons/set95/5076c9d9.png'>
    </li>
    <li>
        <img class='my_image' src='http://cdn.mysitemyway.com/icons-watermarks/simple-black/raphael/raphael_gear-small/raphael_gear-small_simple-black_128x128.png'>
    </li>
</ul>Click the image to make clone and then click save btn to store in local sorage html5 and after that refresh to retreave the images in below box
<div class="block" id="block_test"></div>
<input id="button" type="button" value="save">

JS

.lib {
    border:1px solid #000;
}
.lib li {
    display:inline;
}
.lib img {
    width:100px;
}
#block_test {
    border:1px solid #000;
    height:300px;
}

$(".my_image").click(function () {
    $(this).clone().addClass('input').removeClass('my_image').appendTo(".block").freetrans({
        x: 0,
        y: 0
    });
});

function setBackground() {
    localStorage.input = $(".input").attr('src');
}

function loadBackground() {
    if (localStorage.input.length == 0) {
        localStorage.input = "empty";
    } else {
        var img_elem = $('<img id="output">');
        img_elem.attr('src', localStorage.input).addClass('input').removeClass('my_image').appendTo(".block").freetrans({
            x: 0,
            y: 0
        });

        localStorage.input = $(arr[0]).attr('src');
    }
}

$("#button").click(function () {
    setBackground();
});

$（“.my_image”）。单击（函数（）{
$（this.clone（）.addClass（'input'）.removeClass（'my_image'）.appendTo（'block'）.freetrans({
x:0,，
y:0
});
});
功能背景（）{
localStorage.input=$（“.input”）.attr（'src'）；
}
函数loadBackground（）{
if（localStorage.input.length==0）{
localStorage.input=“empty”；
}否则{
变量img_elem=$（'
链接到jsfiddle

提前谢谢。我希望我能澄清我的问题。
本地存储的使用是您代码中的错误，下面我将对此进行解释

使用window.localStorage–存储没有过期日期的数据
当需要设置应在下一页或重新加载后反映的变量时，请使用：

var someVarName=“value”；
setItem（“someVarName”，someVarName）

在任何页面中（如加载页面时），获得如下内容：

var getVarName = localStorage.getItem("someVarName");

.getItem（）将返回null或存储的值


您更新的javascript如下所示

$(".my_image").click(function () {     $(this).clone().addClass('input').removeClass('my_image').appendTo(".block").freetrans({
        x: 0,
        y: 0
    });
});

function setBackground() {
    localStorage.setItem("someVarName", $("#block_test").html());
}

function loadBackground() {
    if(localStorage.getItem("someVarName")!=null){
        var storedImages = localStorage.getItem("someVarName");
        $("#block_test").html(storedImages)
    } else {
        $("#block_test").html("No Images Yet");
    }
}

$("#button").click(function () {
    setBackground();
});

$(document).ready(function () {
    loadBackground();
});

我提供了一个更新的演示
http://jsfiddle.net/fq58hrh1/29/
要测试它，请单击图像，然后保存它，然后重新加载页面。
这里的警报在哪里？因为您正在“警告”DOM节点，而不是src属性。但是，请稍候，您在问题标题
为什么显示警报…
中询问了哪个警报？？@akkii922对不起，先生，实际上我是新来的……所以我从某处抄袭了……我的错误（请解释你的问题-什么不起作用？你期望得到什么结果，你得到了什么。js控制台中有错误代码吗？亲爱的匿名用户，请解释你否决答案的原因。在我看来，我提供的演示小提琴提供了用户要求的解决方案。对不起我不小心做到了。我正试图回去，但我无法修复它。再次非常抱歉。您的代码运行得很好。谢谢@Yaseminçidem，我在否决投票后有点不安，但无论如何，我理解它是如何发生的，现在很好：）