带引导程序的 MVC ActionLink preventDefault()答案

【问题标题】：MVC ActionLink preventDefault() with bootstrap带引导程序的 MVC ActionLink preventDefault()
【发布时间】：2014-03-31 09:44:59
【问题描述】：

我有一个链接，我想获取它的 href 属性并将其设置为表单。

表单位于使用 bootstrap 3 制作的模式窗口内。

这是我的模态窗口：

<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        @using (Html.BeginForm())
        {
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                    <h4 class="modal-title" id="myModalLabel">Confirmation required</h4>
                </div>
                <div class="modal-body">
                        @Html.HiddenFor(model => Model.Id)
                        @Html.Hidden("Decision", "declined")
                        @Html.TextArea("Reason", new { @class = "form-control" })
                </div>
                <div class="modal-footer">
                    <input type="button" class="btn btn-default" data-dismiss="modal" value="Close" />
                    <input type="submit" class="btn btn-primary" value="Decline" />
                </div>
            </div>
        }
    </div>
</div>

这是我的 ActionLink：

@Html.ActionLink("Decline", "ChiefAnswer", null, new { @Id = Model.Id, @Decision = "declined" }, new { @class = "btn btn-sm btn-default confirmLink", @data_toggle="modal", @data_target="#myModal" });

这是脚本：

$(document).ready(function () {

    $("#dialog").dialog({
        modal: true,
        bgiframe: true,
        width: 500,
        height: 200,
        autoOpen: false
    });

    $(".confirmLink").click(function (e) {
        e.preventDefault();

        var hrefAttribute = $(this).attr("href");
        var form = $('input[type=submit]').closest("form");
        form.attr("href", hrefAttribute);
    });

});

问题是，当我单击 ActionLink 时，不会阻止默认操作，因此它会执行该操作。结果不是我的模态，而是新窗口的结果。

换句话说，操作链接仍然会从 href 属性转到页面。

为什么会这样？我在 click 事件上指定了 preventDefault 函数。

【问题讨论】：

您是否尝试过发出警报或写入控制台以确认您正在使用 jQuery？
我尝试了警报。它输入那段代码并执行它。
好的，那是一个好的开始。您是否尝试过对您设置的变量执行相同的操作以确保它们获得您期望的值？
是的，我也试过了。结果相同。
看起来您正试图在您的 javascript 中为您的表单设置一个 href 属性，这应该是一个操作属性吗？

标签： javascript jquery html asp.net-mvc twitter-bootstrap

【解决方案1】：

试试这个，它会为你工作：

$(".confirmLink").click(function (e) {


        var hrefAttribute = $(this).attr("href");
        var form = $('input[type=submit]').closest("form");
        form.attr("href", hrefAttribute);

        return false;
    });

【讨论】：

这不起作用。如果我输入这段代码，它不会显示模态窗口。