未捕获的TypeError:$(...)。load(...)。modal不是关闭后重新打开模态框的函数

时间:2016-04-13 06:22:31

标签: javascript jquery bootstrap-modal

  

未捕获的TypeError:$(...)。load(...)。modal不是函数

当我关闭模态并尝试再次重新打开模态框时,我可以在控制台中看到此错误。 有时它会工作2-3次,然后发出此错误。

有谁能告诉我可能是什么问题?

我在页面上添加了一个div

<div class="modal fade" id="loadmodalbox" tabindex="-1" role="dialog" aria-labelledby="modalLabel" aria-hidden="true"></div>

这是打开模态

的链接
<button class="btn btn-default openmodal" modalbox="affiliateprogrammodal" data-toggle="modal" data-target="#affiliateprogrammodal" bid="'.$company['User']['u_id'].'">'.$company['User']['u_text_for_blue_button'].'</button>

然后我使用以下代码加载这个不同的模态:

$('.openmodal').click(function(e){ 
e.preventDefault();
var modalbox = $(this).attr('modalbox'); 
var companyid = '';
if(modalbox=='commentmodal') {
    companyid = $(this).attr('companyid');
    companyid = '/'+companyid;
}
if(modalbox=='affiliateprogrammodal') {
    companyid = $(this).attr('bid');
    companyid = '/'+companyid;
}
$('#loadmodalbox').load('<?php echo Router::url(array('controller'=>'users','action'=>'loadmodalbox')); ?>/'+modalbox+companyid).modal({
                              keyboard: false,
                              show:true,
                              backdrop:'static'
                            });
});

1 个答案:

答案 0 :(得分:0)

您可以添加HTML页面和JS文件吗?从我们所拥有的,可能是一个尚未加载页面的问题。如果您的模态显示,但没有内容,则会出现这种情况。

在这种情况下,请尝试在加载回调中调用.modal()方法。

$('.openmodal').click(function(e){ 
    e.preventDefault();

    var modalbox = $(this).data('modalbox'); 
    var companyid = '';
    
    if(modalbox=='commentmodal') {
        companyid = "/" + $(this).data('companyid');
    }
    
    if(modalbox=='affiliateprogrammodal') {
        companyid = "/" + $(this).data('bid');
    }

    var url = '<?php echo Router::url(array('controller'=>'users','action'=>'loadmodalbox')); ?>/' + modalbox + companyid;
    $('#loadmodalbox').load(url, function(){
        $(this).modal({
          keyboard: false,
          show: true,
          backdrop: 'static'
        });
    });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div class="modal fade" id="loadmodalbox" tabindex="-1" role="dialog" aria-labelledby="modalLabel" aria-hidden="true"></div>

<button class="btn btn-default openmodal" data-modalbox="affiliateprogrammodal" data-toggle="modal" data-target="#affiliateprogrammodal" data-bid="'.$company['User']['u_id'].'">'.$company['User']['u_text_for_blue_button'].'</button>