ajax - 如何在 MVC3 中将事件关联到 Html.ActionLink

Question

我已经制作了一个 Ajax 函数，但我遇到了一个大问题。
我在点击链接时显示内容。链接是从数据库中获取的，链接的 url 也是从数据库中获取的。我已经编写了 ajax 以在单击链接时动态调用内容

<script type="text/javascript">
$(document).ready(function () {
  $('a').click(function (e) {
   e.preventDefault();
   var filename = $(this).text();
   var Hobbyurl = '@Url.Action("FetchUrlByHobbyName")';
   $.ajax({
            type: "POST",
            url: Hobbyurl,
            data: { data: filename },
            success: function (returndata) {
            $('iframe').attr('src', returndata);
            }
                    });
                });
            });
  </script>

现在 FetchUrlByHobbyName 是从控制器调用的函数，它返回 url

 //Ajax routine to fetch the hobbyinfo by hobbyname
    [HttpPost]
    public ActionResult FetchUrlByHobbyName(string data)
    {
        HobbyMasters hobbymaster = new HobbyHomeService().FetchHobbyMasterByHobbyName(data);
        string url = hobbymaster.InformationUrl;
        if (HttpContext.Request.IsAjaxRequest())
            return Json(url);
        return View();
    }

在我看来，我写了这样的链接：

@foreach (var item in Model)
{
   <li >@Html.ActionLink(item.HobbyName, "Hobbies")
   </li>
}

我试过这个：

@Html.ActionLink(item.HobbyName, "Hobbies", null, new { id = "alink" })

然后在单击“alink”时调用 Ajax，但是这样我的 ajax 函数不会被调用。
现在的问题是，点击页面上的每个链接都会调用 ajax 函数。
我想为它分配一个唯一的 ID，但我不明白该怎么做，请帮助我...

Answer 1

对于该特定链接，分配一个 ID。例如

<a id="someID" href="url">Link</a>

并且仅将点击与该链接绑定。

$('#someID').click(function (e)) ....

Answer 2

尝试为您的操作链接提供一个 CSS 类选择器，如下所示...

@Html.ActionLink("some link", "Create", "Some_Controller", new { }, new { @class = "test" })

然后用户 jquery 为它..

<script type="text/javascript">
$(document).ready(function () {
  $('.test').click(function (e) {
   e.preventDefault();
   var filename = $(this).text();
   var Hobbyurl = '@Url.Action("FetchUrlByHobbyName")';
   $.ajax({
            type: "POST",
            url: Hobbyurl,
            data: { data: filename },
            success: function (returndata) {
            $('iframe').attr('src', returndata);
            }
                    });
                });
            });
  </script>

Answer 3

如果我理解正确，这可以帮助你

<a href="/somepath" id="mySuperLink" onclick="myAjaxFunction()">The text of the link</a>
    <script type="text/javascript">
    function myAjaxFunction(){
       e.preventDefault();
       var filename = $(this).text();
       var Hobbyurl = '@Url.Action("FetchUrlByHobbyName")';
       $.ajax({
                type: "POST",
                url: Hobbyurl,
                data: { data: filename },
                success: function (returndata) {
                $('iframe').attr('src', returndata);
                }
      });


  </script>