如何防止 href 重定向到外部页面。

Question

我有一个 Index.Html 文件，我想在引导模式中打开它而不退出模式本身。本质上充当内部链接。我正在尝试使用 ASP.net mvc 来做到这一点。该位置是从 Captivate 9 生成的，我正在尝试将单张幻灯片作为示例添加到模态中

Javascript：

var modal3 = document.getElementById('myModal3');
var img3 = document.getElementById('myImg3');
var modalImg3 = document.getElementById("img03");
img3.onclick = function () {
    modal3.style.display = "block";

}

var span = document.getElementsByClassName("close")[2];
span.onclick = function () {
    modal3.style.display = "none";
}

模态：

<div id="myModal3" class="modal">
    <span class="close" style="color:white">×</span>
</div>

Answer 1

我写的与此类似的东西是使用 Ajax。我不确定你想走这条路，但至少值得一试！您只需在单击的某个元素上添加一个 btnCreate id，它应该可以工作！

    <!-- modal placeholder-->
<div id='myModal' class='modal fade in'>
    <div class="modal-dialog">
        <div class="modal-content">
            <div id='myModalContent'></div>
        </div>
    </div>
</div>

html about 只是您要加载的内容的占位符。

此脚本只是打开窗口并加载内容。几乎从您的控制器中拦截它。这可以是您要加载到此 Modal 窗口中的 PartialView！

$(function () {
    $.ajaxSetup({ cache: false });

    $("body").on("click", "#btnCreate", function (e) {
        $('#myModalContent').load(this.href, function () {
            $('#myModal').modal({
                backdrop: 'static',
                keyboard: true
            }, 'show');
            bindForm(this);
        });

        return false;
    });
});

然后关闭模态窗口。

function bindForm(dialog) {
     $('form', dialog).submit(function () {
        $.ajax({
            url: this.action,
            type: this.method,
            data: $(this).serialize(),
            success: function (result) {
                if (result.success) {
                    $('#myModal').modal('hide');
                } else {
                    $('#myModal').modal('hide');
                }
            }
        });
        return false;
    });
}