如果使用jquery将img标记为空,如何放置默认图像

时间:2014-06-16 23:01:42

标签: javascript jquery html css html5

我想做的是将img标签中的默认图像文件放入empty,或者用户还没有上传他的图片。

当前输出:http://jsfiddle.net/LvsYc/3117/

HTML:

<form id="form1" runat="server">
    <img id="Picture" data-src="#" alt="your image" /> <br />
    <input type='file' id="imgInp" />
</form>

脚本:

$(function () {
    var loader = 'http://i38.photobucket.com/albums/e149/eloginko/profile_male_large_zpseedb2954.jpg';
    $('img[data-src]:not([src])').each(function () {
        console.log(this);
        var $img = $(this).attr('src', loader),
            src  = $img.data('src'),
            $clone = $img.clone().attr('src', src);
        $clone.on('load', function () {
            $img.attr('src', src);
        });
    });
});

function readURL(input) {
    if (input.files && input.files[0]) {
        var reader = new FileReader();

        reader.onload = function (e) {
            $('#Picture').attr('src', e.target.result);
        }

        reader.readAsDataURL(input.files[0]);
    }
}

$("#imgInp").change(function(){
    readURL(this);
});

0 个答案:

没有答案