javascript - 使用 URL.Action 帮助程序生成 URL 并正确编码 JavaScript 变量

Question

我正在尝试使用 Url.Action 帮助程序生成的 URL 通过 AJAX 调用 ASP.MVC 中的操作方法。我有一些参数，它们是使用 jQuery 从 DOM 中提取的 javascript 变量。

我尝试了两种方法，但都失败了。

我仅使用两个变量简化了示例。在现实世界中有四种(十进制？、字符串、字符串、字符串)。

第一:

var link = '@Url.Action(MVC.ControllerName.ActionNames.Edit, MVC.ControllerName.Name)';
link = link + '?first=' + first + '&second=' + second;

在这种情况下，所有参数都传递给操作方法，但是当变量包含一些非标准字符(例如“é”)时，它的格式错误，并且我在恢复它的正确编码时遇到问题(例如“Simplifi�s”而不是“Simplifiés”)

第二:

var link = '@Url.Action(MVC.ControllerName.ActionNames.Edit, MVC.ControllerName.Name, new { first = "-1", second = "-2"})'

link = link.replace("-1", first);
link = link.replace("-2", second);

在这种情况下，只有第一个变量(可以为空的十进制)传递给操作方法。其余的都是空字符串。

我注意到在第二种情况下链接看起来像这样:

/ControlerName/Edit?first=890 &amp ;second=Something

(在 890 和 ;second 之间插入空格只是因为堆栈溢出的 html 渲染)

第一种情况如下所示:

/ControlerName/Edit?first=890&second=Something

操作方法如下所示:

[HttpGet]
public virtual ActionResult Edit(decimal? first, string second)
{
   //code
}

Ajax 调用如下所示:

$.ajax({
    url: link,
    type: 'get',
    cache: false,
    async: true,
    success: function (result) {
        $('#someId').html(result);
    }
});

从 DOM 中选择变量，如下所示:

var first = $(this).closest('tr').find('.first').html();

Answer 1

@Url.Action 将为您的基本 url 进行必要的编码，但您必须处理 2 个 javascript 变量 first 和 second< 的 url 编码 你自己。

一种简单的方法是使用 encodeURIComponent():

var link = '@Url.Action(MVC.ControllerName.ActionNames.Edit, MVC.ControllerName.Name)';
link = link 
       + '?first=' + encodeURIComponent(first) 
       + '&second=' + encodeURIComponent(second);

或者正如@Nilesh在评论中提到的，您可以使用encodeURI()一次性完成

var link = '@Url.Action(MVC.ControllerName.ActionNames.Edit, MVC.ControllerName.Name)';
link = link + '?first=' + first + '&second=' + second;
linkToUse = encodeURI(link);