Question

我有一个循环，可以检索并将我的数据分配给表单中的元素。

到目前为止，效果很好。但是，如何从本地存储中抓取src并填充图像src？

本地存储：

Key = smallImage1_1 
Value = file:///var/mobile/Applications/66294192-6BFD-458B-B571-89ABA5F7F7E8/tmp/cdv_photo_049.jpg

JS：

$(document).ready(function() {
    if (localStorage) {
        localStorage.setItem("flag", "set");
        // Browser supports it
        $(".stored").change(function () {
            var data = $(this).val();
            var thisName = $(this).attr('name');
            var thisValue = $(this).val();
            localStorage.setItem(thisName, thisValue);
        });

        // Test if there is already saved data
        if (localStorage.getItem("flag") == "set") {

            // Same iteration stuff as before
            var data = $("#formID").serializeArray();

            //only way we can select is by the name attribute, but jQuery is down with that.  
            $.each(data, function (i, obj) {
                $("[name='" + obj.name + "']").val(localStorage.getItem(obj.name));
            });
        }
    }

// save url to local storage
function onPhotoDataSuccess1_1(imageURI) {
var smallImage1_1 = document.getElementById('smallImage1_1');
smallImage1_1.src = imageURI;
var thisValue = smallImage1_1.src;
var thisName = smallImage1_1.name;
localStorage.setItem(thisName, thisValue);}

HTML：

<li class="odd">
    <h2>Are there Par levels in place?</h2>
    <input name="k11" id="k11" tabindex="1" class="stored" type="text" placeholder="Notes..."  >
    <div class="bottom">
        <div class="ynDropdown" name="k12"></div>
        <div class="ratingDropdown" name="k13"></div>
        <img style="width:38px;height:38px;" id="smallImage1_1" class="camera" src="../img/camera.png" onclick="capturePhoto1_1();" name="smallImage1_1"/>
        <img style="width:38px;height:38px;" id="smallImage1_2" class="camera" src="../img/camera.png" onclick="capturePhoto1_2();" name="smallImage1_2"/>
        <img style="width:38px;height:38px;" id="smallImage1_3" class="camera" src="../img/camera.png" onclick="capturePhoto1_3();" name="smallImage1_3"/>
        <span class="clear"></span>
    </div>
</li>

Answer 1

您可以选择所有必需的图像，并根据其名称为每个图像设置src：

$('#formID .bottom img').each(function()
{
    $(this).attr('src', localStorage.getItem($(this).attr('name')));
});

从$ .each中的本地存储中检索图像src

1 个答案: