时间戳

首页 > 解决方案 > 同一页面中的引导模型对话不起作用

javascript - 同一页面中的引导模型对话不起作用

问题描述

我有一个带有 jQ​​uery 数据表的 Bootstrap 3 模型对话。如果第一个打开和关闭第二个背景消失而没有对话并冻结。甚至鼠标点击也不起作用。

我的动作链接

  @Html.ActionLink("Get File ", "_ViewFIles", "POPM_Trn_Job", null, new { @class = "modal-link btn btn-success" })
  @Html.ActionLink("Get Shared ", "GetSharedWithMe", "POPM_Trn_Job", null, new { @class = "modal-link2 btn btn-success" })

我的对话

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


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

我的第一个 jQuery

                   $(function () {

                   $('body').on('click', '.modal-link', function (e) {
                        e.preventDefault();
                        $(this).attr('data-target', '#modal-container');
                        $(this).attr('data-toggle', 'modal');

                  });


                  $('body').on('click', '.modal-close-btn', function () {
                        $('#modal-container').modal('hide');
                    });


                $('#modal-container').on('hidden.bs.modal', function () {
                $(this).removeData('bs.modal');
                });

                 $('#CancelModal').on('click', function () {
                        return false;
                    });
                });

第二个功能

                ` $(function () {
                 $('body').on('click', '.modal-link2', function (e) {
                 e.preventDefault();
                 $(this).attr('data-target', '#modal-container-Share');
                 $(this).attr('data-toggle', 'modal');

                 });

                 $('body').on('click', '.modal-close-btn', function () {
                 $('#modal-container-Share').modal('hide');
                 });

   $('#modal-container-Share').on('hidden.bs.modal', function () {
                  $(this).removeData('bs.modal');
                  });

                  $('#CancelModal').on('click', function () {
                  return false;
                  });
                });

我做错了什么？

标签： javascriptjqueryhtmlcssbootstrap-modal

解决方案

我解决了这个问题。我的脚本文档部分充满了三个 jQuery 引用；删除它们解决了这个问题。我猜是因为每个部分视图都带有引用，而主页也有一个引用，因为每个视图都必须使用 jQuery 数据表。

推荐阅读