如何基于URL在CSHTML中条件显示指定Div内容？

嘿，别着急！针对你要在采购应用的CSHTML页面里，仅当URL包含#tab1时才显示div2的需求，我给你几个简单易懂的方案——毕竟你几乎没接触过C#，咱们尽量用最容易上手的方式来：

优先推荐：前端JavaScript方案（最靠谱） #

因为URL中#后面的哈希值不会发送到服务器，所以后端C#其实拿不到这个值，用前端JS判断是最直接的方式，步骤也很简单：

1. 先给你的div2设置默认隐藏，同时加一个唯一ID方便定位：

<div id="targetDiv2" style="display: none;">
    <!-- 这里是你要控制显示的div2内容 -->
</div>

2. 在页面底部（确保在div2之后）添加这段JS代码：

// 页面加载完成后检查哈希值
window.addEventListener('load', function() {
    // 去掉哈希值前面的#号，拿到纯标签名
    const activeTab = window.location.hash.replace('#', '');
    // 判断是否是tab1，如果是就显示div2
    if (activeTab === 'tab1') {
        document.getElementById('targetDiv2').style.display = 'block';
    }
});

// 额外处理用户手动切换tab的情况（比如点击页面内的tab导航）
window.addEventListener('hashchange', function() {
    const activeTab = window.location.hash.replace('#', '');
    const div2 = document.getElementById('targetDiv2');
    if (activeTab === 'tab1') {
        div2.style.display = 'block';
    } else {
        div2.style.display = 'none';
    }
});

为什么之前的实现可能没生效？ #

• 如果之前用了后端C#判断：因为哈希值不会传到服务器，后端永远拿不到#tab1，所以判断条件永远不成立
• 如果之前用了JS但没生效：可能是JS代码写在div2之前（页面还没加载到div2就执行代码，找不到元素），或者判断时没去掉#号（比如直接判断window.location.hash === 'tab1'，但实际值是#tab1）

备选：后端C#方案（仅适用于非哈希的情况） #

如果你的URL是用查询参数（比如https://www.website.com/subsite/info?tab=tab1）而不是哈希的话，才适合用后端C#判断，代码如下：

@{
    // 获取URL中的查询参数tab的值
    string activeTab = Request.Query["tab"];
}

@if (activeTab == "tab1")
{
    <div>
        <!-- 这里是div2的内容 -->
    </div>
}

但注意：这个方案不适用于你说的#tab1哈希场景，因为哈希值不会被发送到服务器，后端拿不到。

内容的提问来源于stack exchange，提问作者Bob Klimes