Question

我必须在视图中调用此javascript函数：

$("#addCompositionItem").click(function (carrier) {
        $.mobile.loading('show');
        $.ajax({
            url: this.href,
            cache: false,
            success: function (html) {
                $("#Compositions"+carrier).append(html);
                $("#newServicePageContent").trigger("create");
                $.mobile.loading('hide');
            }
        });

        return false;
    });

如您所见，carrier是一个用于在不同容器中加载html部分的参数。如何从操作链接传递此值？我正在尝试：

@Html.ActionLink("Text", "ActionName", "ControllerName", new { id = "addCompositionItem", carrier="XYZ",type = "submit" })

但没有成功

Answer 1

我理解正在发生的事情的方式是，您正在使用HTML Helper生成锚标记，然后通过JavaScript附加以处理click事件。在您的处理程序中，您希望能够从原始链接获取一段数据。

我的建议是使用HTML数据注释来保存数据。正如您现在所拥有的那样，您的参数只是通过路由参数编码到href属性中。如果您将其移动到html属性并使用data_carrier，框架将生成您的锚标记，如下所示（不是下划线到连字符是自动转换）：

@Html.ActionLink("Text", "ActionName", "ControllerName", new { /*route params*/}, new { data_carrier="..." })

应该导致类似：

<a href='...' data-carrier='...'>...</a>

然后在您的JavaScript中，不要尝试将值作为参数获取，只需使用jQuery data()方法或您喜欢的任何原始JavaScript来访问该属性。

var carrier = $(this).data('carrier');

我认为这将涵盖您的用例。

Answer 2

以下代码段由EndangeredMassa在this SO question.中提供。它应该可以解决您的问题。

<html>
<head>
<script type="text/javascript">

    // Wait for the page to load first
    window.onload = function() {

      //Get a reference to the link on the page
      // with an id of "mylink"
      var a = document.getElementById("mylink");

      //Set code to run when the link is clicked
      // by assigning a function to "onclick"
      a.onclick = function() {

        // Your code here...

        //If you don't want the link to actually 
        // redirect the browser to another page,
        // "google.com" in our example here, then
        // return false at the end of this block.
        // Note that this also prevents event bubbling,
        // which is probably what we want here, but won't 
        // always be the case.
        return false;
      }
    }
</script>
</head>
<body>
    <a id="mylink" href="http://www.google.com">linky</a>        
</body>
</html>

使用MVC3从ActionLink传递值到Javascript函数

2 个答案: