Jquery 模态第二次不起作用

Jquery modal not working second time

本文关键字:不起作用 第二次 模态 Jquery      更新时间:2023-09-26

我正在使用codeigniter开发一个应用程序。在此应用程序中遇到模态窗口未第二次打开的问题。

详细地。

我有包含两个选择框和搜索按钮的表单(视图(。用户将选择选项,然后单击搜索按钮,它将显示分页结果。我正在使用 ajax 来获得结果。分页也基于 ajax。在此表结果上,用户可以编辑或更新任何记录。问题来了。我正在模态窗口中显示更新表单。在该模态窗口中,我必须进行一些jquery验证。为此,我包括jquery库。当我第一次点击编辑按钮时,显示模态窗口,第二次抛出错误

Uncaught TypeError: Object [object Object] has no method 'modal' 

如果我从模态窗口中删除了 jquery 库,那么它工作正常。

我对此使用的代码是

我的第一个视图

 <script src="<?php print base_url()?>js/dboard.js" type="text/javascript"></script>       
 <script type="text/javascript" src="<?php print base_url()?>js/jquery.min.js"></script>
 <script type="text/javascript" src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
 <script type="text/javascript">
    $(document).ready(function(){               
       $('#view_all').bind("click",function(e){
            var pubid = $('#pub').val();            
            var magid = $('#mag').val();
            var limit = 0; 
            $.post('../user/ajax_view_all',{p_id:pubid,m_id:magid,l:limit},function (data){     
        $('#result_table').html(data);
            });
            //Load pagination on ajax click
            $(document).on("click",".pagination a",function(event){
              var url = $(this).attr("href"); 
              var limit = url.substring(url.lastIndexOf('/') + 1);
              jQuery('.pagination a').removeClass('active');                    
                    $.post($(this).attr('href'),{p_id:pubid,m_id:magid,l:limit},function (data){                                            
                $('#result_table').html(data);
            });                         
             return false; 
            });
                //Open update form in modal window
            $(document).on("click",".btn-setting",function(e){
             edit_id = 2;
             $("div[id='myModal']").modal();
             $.post('../user/update_publishing_modal',{ed_id:edit_id},function(data){
              $('.modal-body').html(data);
            });
            e.preventDefault();
            return false;
            });             
        });
      });        
    </script>

同一页面中的模式表单。

<div class="modal hide fade" id="myModal">
  <div class="modal-header">
    <button type="button" class="close" data-dismiss="modal">×</button>
    <h3>Update Schedule</h3>
  </div>
  <div class="modal-body"></div>
  <div class="modal-footer">
    <a href="#" class="btn" data-dismiss="modal">Close</a>
    <a href="#" class="btn btn-primary">Save changes</a>
 </div>
</div>

请告诉这有什么问题。如何将 jquery 库包含在模态窗口中。

我看到大括号放错位置的小问题,不确定它是否会导致此问题:您需要替换:

        });             
        }
    });
  });  

跟:

        });
    });
});

在脚本的末尾。