ASP.NET MVC中如何将JavaScript变量传递给Razor代码？

你遇到的核心问题是服务器端代码与客户端JavaScript的执行时机不匹配：@Url.Action是ASP.NET Razor的服务器端语法，在页面被发送到浏览器之前就已经执行并生成了静态URL；而JavaScript变量val是用户点击Tab时才在客户端产生的动态值，服务器端代码根本无法获取到这个客户端的动态变量。

我们可以先在服务器端生成基础的URL模板，然后在客户端JavaScript中替换模板里的占位符为实际的val值，具体有两种常用实现方式：

方式1：使用占位符替换Action名称 #

先通过@Url.Action生成包含占位符的URL，然后在JS中把占位符替换为val：

function GetTabPane(val) {
  // 生成带占位符的基础URL，{action}会被替换成实际的Action名称
  var urlTemplate = '@Url.Action("{action}", "Doctors", new { id = Model.Id })';
  // 替换占位符为当前Tab的标识val
  var actualUrl = urlTemplate.replace("{action}", val);
  
  $('#'+val).load(actualUrl, function () {
    $('#'+val).tab('show'); // 注意：原代码的tab-pane('show')有误，正确方法是tab('show')
  });
}

方式2：拼接基础路径与Action名称 #

如果你的Action名称和Tab的val标识完全对应，也可以直接拼接控制器的基础路径和Action名称：

function GetTabPane(val) {
  // 获取Doctors控制器的基础路径（用一个临时占位Action生成路径后移除）
  var controllerBaseUrl = '@Url.Action("TempAction", "Doctors")'.replace('TempAction', '');
  // 拼接完整请求URL：基础路径 + Action名称 + id参数
  var actualUrl = controllerBaseUrl + val + '?id=' + '@Model.Id';
  
  $('#'+val).load(actualUrl, function () {
    $('#'+val).tab('show');
  });
}

• 修正了原代码中的方法调用错误：tab-pane是元素的类名，Bootstrap Tab的切换方法应该是tab('show')。
• 请确保Doctors控制器中存在与val对应的Action方法（比如Info、Diplomas、Contacts等），且这些Action接受id参数并返回对应的PartialView，这样load方法才能正确加载Tab内容。

内容的提问来源于stack exchange，提问作者Azizjan Hamidovich Ayupov