加载外部模态javascript

时间:2017-12-10 13:59:34

标签: javascript jquery html bootstrap-modal

我有主要的HTML文件和JavaScript文件我在我的项目中使用了modal按钮单击将显示另一个文件中的模态,我已经使用了代码但它无法正常工作。

在按钮上单击函数搜索(),应显示模态,并且modal.HTML内容根据传递的id

我收到错误

Uncaught TypeError: $(...).modal is not a function
at HTMLButtonElement.<anonymous> (main.js:6)
at HTMLDocument.dispatch (jquery.min.js:3)
at HTMLDocument.q.handle (jquery.min.js:3)

这是代码

的index.html

<body>
   <!--some code-->
   <div id="mymodal"> </div>
</body>

main.js

$(document).ready(function() {
$('.Links').on('click', '[data-toggle="modal"]', function() {

    var id = $(this).attr('id');

    $('#mymodal').modal('show').find('.modal-body').load("next.html?id="+id);
    });
$("#submit").click(function() {
    Search(search);
});
});

function Search(search) {
    '<button class="button Links" data-toggle="modal" id='+id+'>See Details</button>'
}

next.html

<div id="mymodal2" class="modal fade">
<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 Box</h4>
        </div>
<div class="modal-body">
</div>
</div>
</div>
</div>

更新

由于未正确包含文件,我遇到了错误。现在我已经解决了他们,但问题已经解决了一半。现在当点击按钮时,屏幕变得暗淡,就像显示模态并且背景变得暗淡但在我的情况下没有显示模态

0 个答案:

没有答案