在 Ajax Url 中使用 @url.action 的 .JS 文件答案

【问题标题】：.JS File using @url.action in Ajax Url在 Ajax Url 中使用 @url.action 的 .JS 文件
【发布时间】：2017-10-09 06:13:26
【问题描述】：

我一直试图在另一个外部 .JS 文件中使用 Ajax url 内的 @Url.Action，但不幸的是我没有运气。

这是我的代码：

 $.ajax({
      type: 'post',
      url: "@Url.Action("ClearData","Home")",
      success: function () {

       }
     });

此代码仅在视图本身内有效，但在 Javascript externally 中无效。我已经搜索了一些可能的解决方案，但似乎与此不同。

有没有其他方法可以在另一个.Js 文件中使用@Url.Action？

【问题讨论】：

【解决方案1】：

@Url.Action() 是剃须刀（服务器端）代码，不会在外部文件中解析。选项包括

在主文件中声明一个全局变量，比如说

var url = @Url.Action("ClearData","Home");

然后在外部脚本中在ajax调用中使用url: url

在您处理的元素中包含data- 属性，例如，如果它是一个按钮点击事件，那么

<button data-url="@Url.Action("ClearData","Home")" id="mybutton">

然后在外部文件中读取该值，例如

$('#mybutton').click(function() {
    var url = $(this).data('url');
    $.ajax({
        url: url,
        ....

【讨论】：

感谢@Stephen，它工作正常。我正在使用图像控件将您的按钮更改为 img，并将任何用户选择的图像带入图像控件本身。
@user3559349 我不知道我是否理解正确，但我不需要在主文件中声明全局变量。一旦我在我正在处理的元素中添加了data- 属性，然后按照您所说的var url = $(this).data('url'); 读取外部文件中的值，它就可以正常工作了。感谢您的回答。
@user3559349 非常感谢您，我使用了您的解决方案，但我使用了一个隐藏字段，例如：<input type="hidden" data-url="@Url.Action("Action", "Controller")" id="hidUrl"> 并从 jquery var url = $('#hidUrl').data('url'); 调用它。它的工作完美。

【解决方案2】：

如果你的 js 代码在视图中

$.ajax({
      type: 'post',
      url: "@Url.Action("ClearData","Home")",
      success: function () {

       }
     });

这是工作

当 js 代码是单独的（外部文件）时 @Url.Action("ClearData","Home") 不行，这种情况下你必须写总 url 或文件夹路径

【讨论】：

【解决方案3】：

你可以创建一个局部视图，然后这个视图里面只是隐藏字段的列表比如

@Html.Hidden("ActionName", @Url.Action("ActionName", "Controller"))

生成这个

<input id="ActionName" name="ActionName" type="hidden" value="/controller/ActionName">

那么你可以这样称呼它

  var urlAction = $('#ActioName').val();

或者你可以像我一样创建一个js函数

 function ActionCaller(actionName)
 {
    return $('#' + actionName).val();
 }

 var action = ActionCaller(ActionName);

【讨论】：