1

在我的 asp.net mvc4 视图中，我有一些嵌套的 div 来显示图像，并在其下显示如下文本：

<div id="Outer1" class="elementStatus">
    <div class="image">
        <img id="MyImg1" src="@Url.Content("~/images/InitialImage.gif")">
    </div>
    <div class="text">
        Statuts Text
    </div>
</div>

<div id="Outer2" class="elementStatus">
    <div class="image">
        <img id="MyImg2" src="@Url.Content("~/images/InitialImage.gif")">
    </div>
    <div class="text">
        Statuts Text
    </div>
</div>

和CSS：

.elementStatus
{
    visibility: hidden;
}

.image{
    float: left;
    margin-top: 2px;
    padding-top: 1px; 
    padding-left: 10px;
    width: 35px;    
}
.text{
    float: left;
    margin-top: 1px;
    padding-left: 14px;
    padding-bottom: 2px;
    width: 35%;
    font-weight: bold;
    font-size: 1em;
}

像上面的代码一样，我还有一些其他的，比如说，超过 20 个。

如您所见，称为外部的外部 div 最初是隐藏的，因此图像和文本都不会像我最初想要的那样显示。同样最初，设置了一些默认图像，并且这些初始图像是动画 gif。

然后启动一个进程，并将这些 div 设置为可见（不更改图像）。

第一个问题是默认情况下图像和文本不可见（它继续隐藏）。如果我在 css 中默认设置为可见而不是隐藏，它们就会变得可见。

我为使它们可见所做的是：

$('#Outer' + elemId).prop("visibility", "visible");

请注意，上面的行在 for 内，我的意思是，elemId 将是 1,2，依此类推...

第二个问题： 如果我从一开始就设置为在css中可见，则显示默认的gif动画图像和文本，没问题，但是在执行过程中，我想将这些图像更改为其他新闻（不是动画和这些新图像是PNG图像，而不是gif）所以我执行以下操作：

$('#MyImg' + elemId).prop("src", '@Url.Content("~/images/NewImage.png")');

请再次注意，在上面的行中，elemId 将为 1,2，依此类推...

我的问题是图像已更改，但它们显示为黑色十字，然后在几秒钟后，当进程终止时，它们开始正确可见。这里有什么问题？

4

1 回答 1

3

您需要设置样式属性，该元素没有调用属性visibility，它是具有可见性属性的样式属性。

这样做：

$('#Outer' + elemId).css("visibility", "visible");

您提到的关于图像的黑色十字很可能是图像 url 不正确，浏览器仅显示未找到图像的占位符。如果您检查您的控制台，您可能能够查看图像 url 是否实际正在加载（即，如果不是，您将看到 404 错误）。

于 2013-10-02T20:53:42.823 回答