@Html.ActionLink 没有在花哨的盒子里打开

@Html.ActionLink not opening in a fancybox

我的 ActionLink 没有在 fancybox 中打开所需的 Action,而是只是像普通的 ActionLink 一样工作,在另一个选项卡中生成内容。

这是我包含脚本 _Layout 的方式:

<head>
@Styles.Render("~/Content/css")
@Scripts.Render("~/bundles/modernizr")
@Scripts.Render("~/bundles/angular")

@section Styles {
    <link href="@Url.Content("~/Content/main/Navbar.css")" rel="stylesheet" type="text/css" />
    <link rel="stylesheet" href="~/Content/jquery.fancybox.css" type="text/css" media="screen" />
}
</head>

<body>
<script src="~/Scripts/jquery-ui-1.12.1.js"></script>

<script type="text/javascript" src="~/Scripts/jquery.fancybox-buttons.js"> </script>
<script type="text/javascript" src="~/Scripts/jquery.fancybox-thumbs.js"> </script>
<script type="text/javascript" src="~/Scripts/jquery.fancybox-media.js"> </script>
<script type="text/javascript" src="~/Scripts/jquery.fancybox.pack.js"> </script>
<script type="text/javascript" src="~/Scripts/jquery.fancybox.js"> </script>

<script src="~/Scripts/mail/app.js"></script>
@RenderSection("scripts", required: false)
</body>

我的 ActionResult 是一个 GET 操作,不需要任何 Model.ID 参数。这是动作链接:

@Html.ActionLink("FancyBox", "CreateExpCV", "_CandidateForm", null, new { @class = "fancybox" })

这是脚本:

<script type="text/javascript">
$(function () {
    $('.fancybox').fancybox();
});
</script>

我不明白这是什么问题,我在这个非常令人沮丧的问题上浪费了太多时间。

尝试

$(function () {    
$( ".fancybox" ).click(function( event ) {
 event.preventDefault();
 this.fancybox();
  });
 });

ActionLink 正常工作意味着您的 fancybox 插件不工作或与您的其他插件冲突(可能是 jquery-ui-*)。确保您的插件方向正确。 否则你的脚本看起来不错 :)