使用“data-href”将图像加载到DIV中

我试图获得一个链接，单击它时会将图像加载到DIV中。这是我到目前为止有：使用“data-href”将图像加载到DIV中

JQuery的

$(function() { 
    $(".link").click(function (e) { 
     var url = $(this).data('href') 
     $('.enclosure').load(url) 
     return false; 
    }); 
});

HTML

.enclosure { 
    width: 400px; 
    height: 200px; 
    border: 1px solid black; 
    overflow: hidden; 
} 
.link { 
    cursor: pointer; 
}

HTML

<div class="enclosure"> 
    <img src="http://news.bbcimg.co.uk/media/images/67419000/jpg/_67419697_hull-getty.jpg"> 
</div> 
<div class="link" data-href="http://news.bbcimg.co.uk/media/images/67424000/jpg/_67424686_67424685.jpg">Click me</div>

来源

2013-05-04 Andy

不能使用为图像。而且，由于交叉源限制，请求会以任何方式失败。

相反，src属性更改图像：

$(function() { 
    $(".link").click(function (e) { 
     var url = $(this).data('href') 
     $('.enclosure img').prop('src', url) 
     return false; 
    }); 
});

来源

2013-05-04 22:32:51 Blender

发布在我面前！无论如何，这里是一个小提琴：http://jsfiddle.net/kgvux/1/ – tymeJV 2013-05-04 22:33:17

伟大的帮助，谢谢。 – Andy 2013-05-04 22:34:03

只因为我永远不知道。在这种情况下，在'attr'上使用'prop'会有什么区别？ – 2013-05-04 22:35:10

你应该更新img元素的src属性：

$('.enclosure img').attr("src", url);

来源

2013-05-04 22:35:07

使用“data-href”将图像加载到DIV中

回答

相关问题