基于变量切换页面文本显示与隐藏的技术咨询

存在的问题 #

• 选择器不匹配：HTML中目标元素用的是class="Test-view"，但JavaScript里错误使用了ID选择器$('#Test-view')，无法正确选中元素，需改为类选择器$('.Test-view')
• 条件判断语法错误：if (TestEligibility = false)是赋值操作，不是比较判断，应该用相等运算符==或严格相等运算符===
• Razor布尔值兼容问题：C#的True/False输出到JS中是大写格式，而JS的布尔值是小写的true/false，会导致JS语法错误，需要转成符合JS规范的格式
• 后端拼写错误：你的控制器代码里ViewBag.TestEligibility = TestEligbility;存在拼写错误，TestEligbility少了一个i，会导致ViewBag值始终为null，必须修正
• 逻辑冗余：可以直接根据布尔值简化显示控制逻辑，无需多余的if-else分支

正确实现方案 #

方案1：优化JavaScript逻辑

<div class="Test-view">
    <p>-test successful</p>
</div>        

<script>
    // 用Json序列化确保Razor输出的布尔值符合JS语法规范
    var TestEligibility = @Json.Serialize(ViewBag.TestEligibility);
    // 直接根据布尔值切换元素显示状态
    $('.Test-view').toggle(TestEligibility);
</script>

方案2：后端直接控制渲染（更高效）

如果不需要前端动态切换元素显示状态，直接在后端控制元素是否渲染，无需依赖JS：

@if (ViewBag.TestEligibility)
{
    <div class="Test-view">
        <p>-test successful</p>
    </div>        
}

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