无法从 Razor 'IF' 语句调用 Javascript 方法答案

【问题标题】：Unable to call a Javascript method from a Razor 'IF' statement无法从 Razor 'IF' 语句调用 Javascript 方法
【发布时间】：2015-07-12 08:23:08
【问题描述】：

问题背景：

我正在尝试在呈现视图时检查用户是否登录到我的站点。

问题：

目前我将用户用户名设置为控制器中的 ViewBag 属性，然后在其各自的视图中访问它。我面临的问题是我的 Razor 语法中的 IF 语句似乎没有检查 ViewBag.userName 属性，而反过来又没有调用 JavaScript 方法来设置带有用户名的按钮的内部 HTML。

作为旁注，我有 - 作为测试 - 将 ViewBag 属性设置为 h3 标记，只是为了确保将用户名传递给它所在的视图。

代码：

设置用户名的控制器：

ViewBag.userName = Session["userName"];

观点：

检查 ViewBag 属性 userName 的状态，如果不为 null 即用户已登录，则调用 ShowUsersName 方法将值设置为按钮内部 HTML。

@if (ViewBag.userName != null)
{
    <script>
       var userName= @ViewBag.userName;

        ShowUsersName(userName);
    </script>
}

ShowUsersName 方法：

<script type="text/javascript">

var ShowUsersName = function (userName) {

    var html = '<span class="glyphicon glyphicon-user"></span> Hi, '+ userName +'"<strong class="caret glyphicon glyphicon-triangle-bottom"></strong>';

    document.getElementById("userButton").innerHTML = html;

};
</script>

【问题讨论】：

为了确保只检查页面的视图源，如果您在 IF 块中找到语句，那么它运行正确，现在问题出在 JS 函数中。
你的代码sn-ps是否完整？ ShowUsersName 中是否有结束脚本标记？此外，我会在 var userName = "@ViewBag.userName"; 中用双引号将 "@ViewBag.userName" 括起来
还有，应该是 ShowUsersName(userName); ?

标签： javascript c# asp.net-mvc asp.net-mvc-4 razor

【解决方案1】：

我不认为简单地将脚本标签放在 if 语句中会导致 javascript 运行。您需要将此绑定到加载主体（或其他事件）

<body onload='jsFunction()'>

如果你使用 jQuery，你可以有一个脚本部分：

$(document).ready(function() {  
   //your code
});

您可以做的一件事是在 if 语句中创建一个隐藏元素或具有用户名值的输入：

<div id='user-name' style='display:none;'>
@if (ViewBag.userName != null)
{
    @ViewBag.userName
}
</div>

在你的 jQuery 中（如果你使用 jQuery）：

$(document).ready(function() {  
   var userName = '';
   userName = $('#user-name').text();
   if (userName != '') {
    //your code if userName is not empty
   }
});

类似的东西。这只是一个简单的示例，您可能会找到另一种方法

【讨论】：

优秀的答案。我正在使用 JQuery 并使用隐藏的 div 方法。它完美地工作。出于兴趣，当我刷新页面时更改的 html 丢失了，我如何在刷新后保留它？
当您刷新页面时，您将点击控制器中的操作方法。再次在 viewbag 中发送用户名。希望有帮助

【解决方案2】：

确保您的 viewbag 不为空。您还可以尝试删除 if 语句以查看它是否呈现脚本。要测试 viewbag 的内容，您可以这样做：

<h1>@ViewBag.userName</h1>

【讨论】：