JQuery全景查看器内部引导模式

我试图从引导模式内部使用jquerypanorama查看器。该站点是一个具有Bootstrap v3.1.1的MVC解决方案

将显示带有图钉的地图。单击pin会发出AJAX请求，使用Panorama Viewer在模式中加载图像并显示它

索引页面发出AJAX请求

以下是索引页面上模式的HTML：

<div id="modal" class="modal fade" tabindex="-1" role="dialog"></div>

<script type="text/javascript">
    $(document).ready(function () {
        $('.pin').tooltip();
        //every time pin is clicked
        $('.pin').click(function () {
            //store id of pin in js object
            var pin = {
                id: $(this).data("id")
            };
            //perform ajax request
            $.ajax({
                //use get type
                type: 'GET',
                //use razor function to bind it to controller function
                url: '@Url.Action("GetPanaramic")',
                //attach store id object
                data: pin,
                //method ran with success
                success: function(result) {
                    $('#modal').html(result);
                    $('#modal').modal('show');
                },
                //method ran with failure
                error: function(error) {
                    $('#modal').html('<div class="modal-header">Failed to get panaramic for this pin</div>');
                }
            });
        });
    });
</script>

以下是索引页面上的JavaScript：

<div id="modal" class="modal fade" tabindex="-1" role="dialog"></div>

<script type="text/javascript">
    $(document).ready(function () {
        $('.pin').tooltip();
        //every time pin is clicked
        $('.pin').click(function () {
            //store id of pin in js object
            var pin = {
                id: $(this).data("id")
            };
            //perform ajax request
            $.ajax({
                //use get type
                type: 'GET',
                //use razor function to bind it to controller function
                url: '@Url.Action("GetPanaramic")',
                //attach store id object
                data: pin,
                //method ran with success
                success: function(result) {
                    $('#modal').html(result);
                    $('#modal').modal('show');
                },
                //method ran with failure
                error: function(error) {
                    $('#modal').html('<div class="modal-header">Failed to get panaramic for this pin</div>');
                }
            });
        });
    });
</script>

$（文档）.ready（函数（）{
$（'.pin'）。工具提示（）；
//每次点击pin时
$（'.pin'）。单击（函数（）{
//在js对象中存储pin的id
var引脚={
id:$（此）.data（“id”）
};
//执行ajax请求
$.ajax({
//使用get类型
键入：“GET”，
//使用razor函数将其绑定到控制器函数
url:'@url.Action（“GetPanaramic”）'，
//附加存储id对象
数据：pin，
//方法运行成功
成功：功能（结果）{
$（'#modal'）.html（结果）；
$（'#model'）。model（'show'）；
},
//方法运行失败
错误：函数（错误）{
$（'#modal'）.html（'无法获取此pin的panaramic'）；
}
});
});
});

全景页面是从索引页面的AJAX请求调用的

以下是全景页面上模式的HTML：

<div class="modal-dialog">
    <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">@Model.GetTitle()</h4>
        </div>
        <div class="modal-body">
            <div id="panorama">
                <img src="@Url.Content(String.Format("~/Content/img/site-plans/{0}", @Model.GetFileName()))">
            </div>
        </div>
    </div>
</div>

<script type="text/javascript">
    $("#panorama").panorama_viewer({
        animationTime: 0,
        easing: "ease",
        overlay: false,
        repeat: @Model.FullRotate.ToString().ToLower()
    });
</script>

&时代；
@Model.GetTitle（）

以下是全景页面上的JavaScript：

<div class="modal-dialog">
    <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">@Model.GetTitle()</h4>
        </div>
        <div class="modal-body">
            <div id="panorama">
                <img src="@Url.Content(String.Format("~/Content/img/site-plans/{0}", @Model.GetFileName()))">
            </div>
        </div>
    </div>
</div>

<script type="text/javascript">
    $("#panorama").panorama_viewer({
        animationTime: 0,
        easing: "ease",
        overlay: false,
        repeat: @Model.FullRotate.ToString().ToLower()
    });
</script>

$（“#全景”）。全景查看器({
动画时间：0，
放松：“放松”，
覆盖：假，
重复：@Model.FullRotate.ToString（）.ToLower（）
});

---

当我加载页面时，模式中的图像总是显示：无

您还可以添加模式html吗？没问题，如果您还需要，请告诉我