调用 JavaScript 函数时在其内部执行 C# 代码答案

【问题标题】：Execute C# code inside JavaScript function when it's called调用 JavaScript 函数时在其内部执行 C# 代码
【发布时间】：2021-08-14 15:19:04
【问题描述】：

我想在运行 JavaScript 函数时执行一段 C# 代码，但它的行为似乎不像我想要的那样，这是一个示例：
假设我在模型中有一个变量 property int Counter {get; set; }，我想在每次运行 JavaScript 函数时递增：

<script type="text/javascript">

function MyFunction(){

    //Do some stuff
    @{Model.Counter++;}

}

</script>

真正发生的是，当页面加载时@{Model.Counter++;} 正在执行，无论是否从函数中调用。
每当我再次运行该功能时，它都会完全忽略它。
这意味着这段代码@{Model.Counter++;} 在页面加载时执行一次，并且不再执行。
如何解决这个问题并让它在我每次运行该函数时执行？

【问题讨论】：

JavaScript = 客户端，C# = 服务器
Razor 不是将服务器端 C# 与客户端 JavaScript 混合的某种方式。相反，它使用 C# 服务器端生成将发送到浏览器的 html(+js)。如果您在浏览器中检查您的页面，您将看不到任何 C#（会有一个 MyFunction，但它是空的）
如果您的项目不太深入，您可以更接近您尝试使用 Blazor 所做的事情，它确实在浏览器中运行 c#（有点……）。默认模板甚至带有一个 Counter 示例。
好吧，我想我明白了，你说得对，客户端没有 C# 代码。我还是 ASP.NET 的新手，对于明显的错误，我深表歉意，并感谢您的回答。
@Crowcoder 我正在为我的大学做一个项目，我的博士希望我们坚持使用 C#、Javascript、CSS、HTML。 :( 但也许我会看看它以供将来使用，谢谢。

标签： javascript c# asp.net-core razor-pages

【解决方案1】：

您可以使用 ActiveX 控件来执行编译程序。但你应该知道你的 html 代码只能在 IE 中运行。

【讨论】：

【解决方案2】：

您必须在视图表单内的某处为 model.counter 创建一个隐藏字段

<input type="hidden" id="modelCounter" asp-for="Counter" value="@Model.Counter" />

在此之后，您可以使用 javascript 更改计数器

function MyFunction(){

    //Do some stuff

var counter=$("#modelCounter").val();
counter++;
   $("#modelCounter").val(counter);

}

【讨论】：

【解决方案3】：

我不认为你想要什么是可能的（也许使用 Blazor？ - 但那是 WebAssembly）。相反，您可以为模型属性分配一个新的 javascript 变量。例如：

<script type="text/javascript">

function MyFunction(){

    //Do some stuff
    let counter = @{Model.Counter};
    counter++;

    // Do some stuff with counter

}
// When you are done, post the counter back if needed on server side

</script>

【讨论】：

我的错，显然你需要增加 javascript 变量。我已经编辑了我的答案。

【解决方案4】：

试试这个

     @{
   var a=Model.Counter;
     }

在脚本之外执行此操作

在函数或脚本内部做

@a++;

或

 var c = @a;
    c++;

希望它有效

【讨论】：