C# 在ASP.net中，如果div中的图像与当前页面URL匹配，我可以使用哪种IF语句隐藏div？

如果这很重要的话，这是在Sitefinity范围内的，我对ASP.NET和C#真的很陌生

我在页面底部有一个基于图像的导航元素，可以使用相同的模板链接到不同的文章。有5篇文章，我想链接到活动页面/文章被隐藏，所以有一个网格的4个图像链接

以下是一个屏幕截图：

下面是它背后的代码：

@{
    string navTitle = string.Empty;
    string url = string.Empty;

    if (Model.CurrentSiteMapNode != null && Model.CurrentSiteMapNode.ParentNode != null)
    {
        if (Model.CurrentSiteMapNode.Title == "Home")
        {
            navTitle = Model.CurrentSiteMapNode.ParentNode.Title;
        }
        else
        {
            navTitle = Model.CurrentSiteMapNode.Title;
        }
        url = Model.CurrentSiteMapNode.ParentNode.Url;
    }
}
 <div class="foundation-stories-container">
    @foreach (var node in Model.Nodes)
    {
        @RenderRootLevelNode(node);
    }
</div>

@*Here is specified the rendering for the root level*@
@helper RenderRootLevelNode(NodeViewModel node)
{
string[] thisPage = (node.Url).Split('/');
string thisImage = thisPage[4] + ".jpg";
 <a href="@node.Url" target="@node.LinkTarget">
     <div class="foundation-story-block">
         <div class="hovereffect">
             <img src="[OUR WEBSITE URL]/stories/@thisImage" class="img-fluid">
             <div class="overlay">
                 <h2>@node.Title</h2>
             </div>
         </div>
     </div>
 </a>
}

这和做以下事情一样简单吗

if (thisImage = thisPage) 
{
   foundation-story-block.AddClassToHtmlControl("hide")
}

看起来很容易，但我不知道从哪里开始

我更擅长Javascript，所以我已经有了一个JS解决方案，但是我真的很想找到一个更干净的方法

<script type="text/javascript">

$(document).ready(function() {

    var active = window.location.pathname.split("/").pop()

    var name = active;
    name = name.replace(/-/g, ' ');

    jQuery.expr[":"].Contains = jQuery.expr.createPseudo(function(arg) {
    return function( elem ) {
        return jQuery(elem).text().toUpperCase().indexOf(arg.toUpperCase()) >= 
    0;
    };
});

$("h2:Contains('" + name + "')").closest(".foundation-story-block").addClass("hide");

});

</script>

$（文档）.ready（函数（）{
var active=window.location.pathname.split（“/”）.pop（）
变量名称=活动；
name=name.replace（/-/g'，）；
jQuery.expr[“：”].Contains=jQuery.expr.createPseudo（函数（arg）{
返回函数（elem）{
返回jQuery（elem）.text（）.toUpperCase（）.indexOf（arg.toUpperCase（））>=
0;
};
});
$（“h2:Contains（“+name+”）”）。最近（“.foundation story block”）。addClass（“hide”）；
});

这存在于主模板页面上

获取URL的最后一部分

将其设置为名为“name”的变量

如果有空格，则将破折号更改为空格（大多数页面都与名称关联，因此类似于/first-last）

然后它查看页面标题所在的位置，如果它等于“name”变量，.hide类被添加到块中

---

感谢任何人提供的帮助。

您可以使用

基础故事块

类将单击事件绑定到元素。我之所以使用

.on

而不是

.click

是因为在使用

UpdatePanel

s时，在UpdatePanel触发其更新事件后，不会触发click事件-您可能会遇到与动态绑定类似的问题，因此我使用

.on

来避免这种情况

$(".foundation-story-block").on("click", function() {
    // Remove the "hide" class from any elements that have it applied
    $.each($(".foundation-story-block.hide"), function(index, value) {
        // Remove the class using the "this" context from the anonymous function
        $(this).removeClass("hide");
    });

    // Add the "hide" class to the element that was clicked
    $(this).addClass("hide");
});

---

我还没有通过IDE运行过这个，所以它可能不是100%正确，但它会让您走上正确的道路。

您可以使用

基础故事块

类将单击事件绑定到元素。我之所以使用

.on

而不是

.click

是因为在使用

UpdatePanel

s时，在UpdatePanel触发其更新事件后，不会触发click事件-您可能会遇到与动态绑定类似的问题，因此我使用

.on

来避免这种情况

$(".foundation-story-block").on("click", function() {
    // Remove the "hide" class from any elements that have it applied
    $.each($(".foundation-story-block.hide"), function(index, value) {
        // Remove the class using the "this" context from the anonymous function
        $(this).removeClass("hide");
    });

    // Add the "hide" class to the element that was clicked
    $(this).addClass("hide");
});

---

我还没有在IDE上运行这个，所以它可能不是100%正确，但它会让您走上正确的道路。

这是可能的，是的。以下是如何：

...
@{
  var hiddenClass = thisImage == thisPage ? "hide" : string.Empty;
}
<div class="foundation-story-block @hiddenClass">
    <div class="hovereffect">
        <img src="[OUR WEBSITE URL]/stories/@thisImage" class="img-fluid">
        <div class="overlay">
              <h2>@node.Title</h2>
         </div>
    </div>
</div>

。。。
@{
var hiddenClass=thisImage==thisPage？“隐藏”：string.Empty；
}
@节点名称

这是可能的，是的。以下是如何：

...
@{
  var hiddenClass = thisImage == thisPage ? "hide" : string.Empty;
}
<div class="foundation-story-block @hiddenClass">
    <div class="hovereffect">
        <img src="[OUR WEBSITE URL]/stories/@thisImage" class="img-fluid">
        <div class="overlay">
              <h2>@node.Title</h2>
         </div>
    </div>
</div>

。。。
@{
var hiddenClass=thisImage==thisPage？“隐藏”：string.Empty；
}
@节点名称

您找到问题的答案了吗？如果是这样的话，你应该发布它来帮助未来的用户。如果以下答案之一解决了您的问题，那么您应该投票并接受它。：-）你找到问题的答案了吗？如果是这样的话，你应该发布它来帮助未来的用户。如果以下答案之一解决了您的问题，那么您应该投票并接受它。：-）