0

所以我已经根据我之前提出的问题更新了我的代码，但现在图像不会显示，我也不知道究竟是为什么。应该发生的是，当我单击一个按钮时，图像应该显示并保持在那里，即使它刷新，但是在单击另一个按钮之前，新图像应该接管并且应该发生同样的事情，即使页面刷新也保持在那里直到他们点击在另一个按钮上，但根本没有图像显示。

这是我的功能：

var maxImages=7,i=1,v;

for(i;i=<maxImages;i++)
{
    v = sessionStorage.getItem('v'+i);
    if(v !== null) showImage(i);
}

function showImage(num)
{
    sessionStorage.setItem('v' + num, '1');
    $("#loadingImage" + num).show();
}

这是我的按钮功能：

<input name="Failure Analysis Lab" style="white-space:normal;" 
 onclick="moveText(this.name);showImage(1);form1.submit();" 
 style="width: 272px; height: 30px;" type="button" 
 value="7QKD Failure Analysis Lab" />

这是我的图片标签：

<img id="loadingImage" alt="" src="images/Overview.gif" 
 style="width:85%;; margin-bottom:3em; display:none;"/>

任何帮助将不胜感激，谢谢。

附加信息：当我检查控制台但没有显示任何图像时，我没有收到任何错误。

4

2 回答 2

1

看看这个小提琴..我做了一些调整是你想要的吗？

将点击事件移动到由 jQuery 处理......并在每个输入上设置数据以检查它想要显示的图像。

var v = sessionStorage.getItem('imageId');
if (v !== null) {
    showImage(v);
}

$("input").on("click", function () {
    var imageId = $(this).attr("imageId");
    showImage(imageId);
});

function showImage(imageId) {
    var img = $("#" + imageId);
    var hidingImg = sessionStorage.getItem('imageId');
    $("#" + hidingImg).hide();
    sessionStorage.setItem('imageId', imageId);
    img.show();
}
于 2013-07-26T20:53:24.240 回答
0

它不像你想象的那样工作（来自你的评论）。之后的#内容必须与元素 ID完全匹配。您必须创建<img id="loadingImage2">,<img id="loadingImage3">等以使该选择器按您的意愿工作。

$("#loadingImage" + num)num = 2例如，当创建选择器时#loadingImage2。如果没有具有属性的元素id="loadingImage2"，则此行将无效。您可以调用show()，jQuery 会尽力显示该元素 - 但您要显示的元素不存在。

因此，假设您有多个 loadingImages，请将您的 HTML 更改为以下内容：

<img class="loadingImage" src="image1.jpg">
<img class="loadingImage" src="image2.jpg">
<!-- And so on -->

然后在你的jQuery中，选择并显示类loadingImage的所有元素$(".loadingImage").show();

于 2013-07-26T20:09:02.877 回答