我正在使用图像放大镜http://asp-net-by-parijat.blogspot.in/2014/09/jquery-zoom-image-on-mouseover-in.html来放大图像。它工作正常,但是我正在使用Java脚本来更改图像的src,但是在悬停时放大不刷新,它仍然显示旧图像,但是图像已更改。我的脚本来改变形象:
function SwitchPic(a) {
$("#img").attr("src", a );
$("#example4").attr("href", a );
}
我在使用放大镜JS的HTML代码
<img data-toggle="magnify" id="img" style="width:288px;" alt="example4" src="~/Images/Product/abc.jpg" />
我在其中调用Java脚本来更改图像src的HTML
<a onclick='SwitchPic("/Images/Products/xyz.jpg")'>
<img class="thumbnail" style="width: 128px; display:inline-block;" src="~/Images/Products/xyz.jpg" />
</a>
如果您查看Magnify代码,则会看到以下初始化程序:
$('[data-toggle="magnify"]').each(function () {
var $mag = $(this);
$mag.magnify()
})
放大的图像无法更新的原因是Magnify初始化程序已经运行,并且不关注任何src
更改。您可以通过在中添加手动调用来解决此问题SwitchPic
:
function SwitchPic(a) {
img = $("#img")
img.attr("src", a );
img.magnify()
}
这是概念证明。
本文收集自互联网,转载请注明来源。
如有侵权,请联系 [email protected] 删除。
我来说两句