在Twitter Bootstrap模式中打开特定页面 [英] Open specific page in twitter bootstrap modal

查看:56
本文介绍了在Twitter Bootstrap模式中打开特定页面的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

如何在Twitter Bootstrap模式下打开特定页面?

我有此页面

NewUser.aspx

NewUser.aspx

包含一个div并继承了母版页导航菜单.

which contains a div and inherits the masterpage navigation menu.

我只想打开包含模式框中的文本框和按钮的div.

I want to just open the div that contains the text boxes and buttons in the modal.

我已经尝试过了

 <a data-target="#"  class="quick-btn" data-toggle="modal" href="/SystemSettings/NewUser.aspx" ></a>

JS

 $(document).ready(function() {
        $('[data-toggle="modal"]').click(function(e) {
            e.preventDefault();
            var url = $(this).attr('href');
            if (url.indexOf('#') == 0) {
                $(url).modal('open');
            } else {
                $.get(url, function(data) {
                    $('<div class="modal hide fade">' + data + '</div>').modal();
                }).success(function() { $('input:text:visible:first').focus(); });
            }
        });
    });

推荐答案

尝试以下方法:

标记:

创建一个占位符 DIV 以显示其中的模式内容,如下所示:

Create a placeholder DIV to show the modal content within, like this:

<a data-target="#myModal" class="quick-btn" data-toggle="modal" href="/SystemSettings/NewUser.aspx">Click Me</a>
<div class="modal hide fade" id="myModal">
</div>

JavaScript:

JavaScript:

.aspx 页面的内容添加到 iframe 中,例如:

Add the .aspx page's content to an iframe, like this:

$(document).ready(function() {
    $('[data-toggle="modal"]').click(function(e) {
        e.preventDefault();
        var url = $(this).attr('href');
        $(".modal-body").html('<iframe width="100%" height="100%" frameborder="0" scrolling="no" allowtransparency="true" src="'+url+'"></iframe>')
    });
});

这篇关于在Twitter Bootstrap模式中打开特定页面的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆