jQuery 中的 ActionLink

Question

这是我的方法：

$(document).ready(function () {
    $('td.clickableCell').click(function () {
        var currentObject = null; 
        currentObject = $(this).text();
        @Html.ActionLink("GetThis", "Get", new {theName = currentObject} )
    });
});

但它说 currentObject 在当前上下文中不存在。如何解决这个问题？

Answer 1

您应该使用 jQuery.get 而不是 @Html.ActionLink功能。 `@Html.ActionLink 在服务器上运行，而 javascript 在客户端上运行。

$(document).ready(function () {
    $('td.clickableCell').click(function () {
        var currentObject = $(this).text();
        $.get('@Url.Action("GetThis", "Get")', {theName : currentObject});
    });
});

Url.Action 在服务器上呈现，并将为您提供适当的 url。 $.get 将在客户端上运行 get 请求。

请记住，如果此 javascript 位于 .js 文件中，则 Url.Action 将不会运行。在这种情况下，您可能只想将其替换为 /Get/GetThis 或在页面上的隐藏字段中呈现 url，并获取 .js 文件。

您需要一个如下所示的操作方法才能访问参数：

public ActionResult GetThis(string theName)
{
    // manipulate theName
    return View();
}

Answer 2

currentObject 是您尝试传递到服务器端代码的 JavaScript String 对象。如果您需要在客户端执行此操作，

$(function () {
    $('td.clickableCell').click(function () { 
        var currentObject = $(this).text();

        // find the anchor element that you need to change,
        // then change the property on it to the value
        // of currentObject
        $('a').attr('title', currentObject);
    });
});

或者，您可能需要以某种方式将值发送到服务器。如果上面的 JavaScript 位于 Razor 视图中，则

$(function () {
    $('td.clickableCell').click(function () { 
        var currentObject = $(this).text();

        // make a HTTP GET request and pass currentObject as a queryparam
        window.location = '@Url.Action("Action", "Controller")' + '?theName=' + encodeURIComponent(currentObject);
    });
});

'@Url.Action("Action", "Controller")' 部分将在服务器端进行评估并由 UrlHelper 解析到路由到该控制器操作的 URL。我们将此值放在单引号中，因为我们需要在客户端的 JavaScript 变量中使用它。然后我们添加 currentObject 作为查询参数（并同时对其进行编码）。

Answer 3

您将客户端代码与服务器端代码混合在一起。在将任何内容发送到客户端之前，此行将在服务器上执行：

@Html.ActionLink("GetThis", "Get", new {theName = currentObject} )

该行本身引用了不存在的内容。 currentObject 在客户端上用 JavaScript 创建之前不会存在。从服务器的角度来看，JavaScript 代码只不过是文本。