Question

我不明白为什么Bootstrap表和jquery都显示popup插件不能同时工作。

如果我删除此行<script type="text/javascript" language="javascript" src="media/js/jquery.js"></script>，则Bootstrap排序和分页无效！

如果我删除此行<script type="text/javascript" src="http://code.jquery.com/jquery-1.6.min.js"></script>，则弹出插件无效！

Html Head部分代码：

<!--for bootstrap table-->
<link rel="stylesheet" type="text/css" href="media/css/jquery.dataTables.css">
<script type="text/javascript" language="javascript" src="media/js/jquery.js"></script>
<script type="text/javascript" language="javascript" src="media/js/jquery.dataTables.js"></script>
<script>
$(document).ready(function() {
    $('#example').dataTable();

    $('#example tbody').on('click', 'tr', function () {
        var name = $('td', this).eq(0).text();

    } );
} );
</script>
<!--for bootstrap table end here-->


<!-- for popup box -->
<link rel="stylesheet" href="../style/reveal.css">  
<script type="text/javascript" src="http://code.jquery.com/jquery-1.6.min.js"></script>
<script type="text/javascript" src="../js/jquery.reveal.js"></script>
<!-- for popup box end here -->

Html正文部分代码

<!--for popup box-->
<div id="myModal2" class="reveal-modal3">
</div>
<a id="join_now" class="big-link2" data-reveal-id="myModal2">Popup</a>
<!--for popup box end here-->

<!--for bootstrap table with sorting and pagiantion option-->
<table id="example" class="display" cellspacing="0" width="100%">
    <thead>
        <tr>
        <th>First Name</th>
        <th>Last Name</th>
        <th>Company</th>
        <th>Position</th>
        <th>Status</th>
        <th>Kit type</th>                          
        </tr>                             
    </thead>                
    <tbody>
        <tr>
            <td>data1</td>
            <td>data2</td>
            <td>data3</td>
            <td>data4</td>
            <td>data5</td>
            <td>data6</td>
        </tr>    
    </tbody>    
</table>
<!--for bootstrap table with sorting and pagiantion option end here-->

Answer 1

使用任何一个jquery。将其包含在head代码的开头。

<script type="text/javascript" src="http://code.jquery.com/jquery-1.6.min.js"></script>

由于jquery.dataTables.js是一个插件，它首先需要jquery-1.6.min.js。

当我使用jquery显示弹出插件时，引导表排序和分页不起作用

1 个答案: