Javascript 更改图像的自定义属性的值
我有一个有两个缩略图像的文档(前面和后面,如银行支票)。我可以通过在缩放中显示来自原始(大)图像的前图像的一部分正方形来缩放前缩略图图像。到目前为止一切正常。 单击前面的图像,将其与后面交换,我应该能够显示后面的缩放。然而,这不起作用。我认为应该修改zoomingRear()属性,并为自定义属性提供一个值,或者zooming()需要以某种方式刷新以显示其他图像。你知道怎么做吗 来自会话的源的我的图像:Javascript 更改图像的自定义属性的值,javascript,jquery,Javascript,Jquery,我有一个有两个缩略图像的文档(前面和后面,如银行支票)。我可以通过在缩放中显示来自原始(大)图像的前图像的一部分正方形来缩放前缩略图图像。到目前为止一切正常。 单击前面的图像,将其与后面交换,我应该能够显示后面的缩放。然而,这不起作用。我认为应该修改zoomingRear()属性,并为自定义属性提供一个值,或者zooming()需要以某种方式刷新以显示其他图像。你知道怎么做吗 来自会话的源的我的图像: <img style="border:1px solid #e8e8e6;" id="z
<img style="border:1px solid #e8e8e6;" id="zoom_mw" onclick="this.src = this.src == rear()
? front() : rear();" src='<%= Session("ImageThumbnailPathFront")%>'
data-zoom-image='<%= Session("ImagePathFront")%>' width="500" height="250" />
'
数据缩放图像=''width=“500”height=“250”/>
JQuery
<script type="text/javascript">
function pageLoad(sender, args)
{
zooming()
}
function front() {
return onImg = '<%= Session("ImageThumbnailPathFront")%>';
}
function rear() {
return offImg = '<%= Session("ImageThumbnailPathRear")%>';
zoomingRear()
}
function zooming() {
$(document).ready(function () {
$("#zoom_mw").elevateZoom({ scrollZoom: true });
});
}
function zoomingRear() { // <-- Problematic function
$(document).ready(function () {
document.querySelector(data-zoom-image='<%= Session("ImagePathRear")%>').elevateZoom({ scrollZoom: true });
// document.getElementById(
});
}
function getElementByAttribute(attr, value, root) {
root = root || document.body;
if(root.hasAttribute(attr) && root.getAttribute(attr) == value) {
return root;
}
var children = root.children,
element;
for(var i = children.length; i--; ) {
element = getElementByAttribute(attr, value, children[i]);
if(element) {
return element;
}
}
return null;
}
</script>
函数页面加载(发送方,参数)
{
缩放()
}
函数front(){
返回onImg='';
}
函数rear(){
返回OFFIG=“”;
变焦后
}
函数缩放(){
$(文档).ready(函数(){
$(“#zoom_mw”).elevateToom({scrollZoom:true});
});
}
函数zoomingRear(){/您正在从onclick调用zoomingRear(),但这是在加载页面之后进行的,因此在zoomingRear()中使用$(document).ready()没有意义。只需尝试删除该函数,并保留如下代码:
function zoomingRear() {
document.querySelector(data-zoom-image='<%= Session("ImagePathRear")%>').elevateZoom({ scrollZoom: true });
}
函数zoomingRear(){
document.querySelector(数据缩放图像=“”).elevateToom({scrollZoom:true});
}