bootstrap中使用jquery表格插件列宽拖动问题 200
使用jquery的插件实现表格列宽拖动长度，用到了bootstrap的切换卡功能，当前页面的（one页面）表格可以拖动，切换到two页面就没办法拖动了，求大神解决办法<h...
使用jquery的插件实现表格列宽拖动长度，用到了bootstrap的切换卡功能，当前页面的（one页面）表格可以拖动，切换到two页面就没办法拖动了，求大神解决办法<head> <title>part</title> <meta name="description" content=""> <script src="https://code.jquery.com/jquery-3.3.1.min.js"></script> <link rel="stylesheet" href="http://demo.sc.chinaz.com/files/download/webjs1/201306/jiaoben1035/libs/bootstrap.css"> <link rel="stylesheet" href="http://demo.sc.chinaz.com/files/download/webjs1/201306/jiaoben1035/libs/bootstrap-responsive.css"> <link rel="stylesheet" href="http://demo.sc.chinaz.com/files/download/webjs1/201306/jiaoben1035/css/jquery.resizableColumns.css"> <link rel="stylesheet" href="http://demo.sc.chinaz.com/files/download/webjs1/201306/jiaoben1035/css/demo.css"> <script src="https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script> <script src="https://cdn.bootcss.com/store.js/1.3.20/store.js"></script> <script src="http://dobtco.github.io/jquery-resizable-columns/dist/jquery.resizableColumns.min.js"></script> <script> $(function(){ $("table").resizableColumns({ store: store }); }); </script></head> <div class="container-fluid"> <div class="row-fluid"> <div class="span12"> <div class="tabbable" id="tabs-575102"> <ul class="nav nav-tabs"> <li class="active"> <a href="#panel-76425" data-toggle="tab">one</a> </li> <li> <a href="#panel-940157" data-toggle="tab">two</a> </li> </ul> <div class="tab-content"> <div class="tab-pane active" id="panel-76425"> <table class="table table-bordered" data-resizable-columns-id="demo-table"> <thead> <tr> <th data-resizable-column-id="#">#</th> <th data-resizable-column-id="first_name" >First Name</th> </tr> </thead> <tbody> <tr> <td>1</td> <td>Mark</td> </tr> <tr> <td>2</td> <td>Jacob</td> </tr> <tr> <td>3</td> <td>Larry the Bird</td> </tr> </tbody> </table> </div> <div class="tab-pane" id="panel-940157"> <table class="table table-bordered" data-resizable-columns-id="demo-table" id="tb"> <thead> <tr> <th data-resizable-column-id="##">#</th> <th data-resizable-column-id="first_name#" >First Name</th> </tr> </thead> <tbody> <tr> <td>1</td> <td>Aaron</td> </tr> <tr> <td>2</td> <td>Abbott</td> </tr> <tr> <td>3</td> <td>Adolph</td> </tr> </tbody> </table> </div> </div> </div> </div> </div></div>
展开
1个回答
展开全部
一、引入文件：
复制代码代码如下:
<script src="/js/jquery-1.8.0.min.js" type="text/javascript"></script>
<script src="/js/store.js" type="text/javascript"></script>
<script src="/js/jquery.resizableColumns.js" type="text/javascript"></script>
二、TABLE
复制代码代码如下:
<table id="myTable" border="1">
<thead>
<tr>
<th data-resizable-column-id="a"><input type="checkbox" /></th>
<th data-resizable-column-id="b">栏目类型 </th>
<th data-resizable-column-id="c">活动名称 </th>
<th data-resizable-column-id="d">状态 </th>
<th data-resizable-column-id="e">操作选项</t
复制代码代码如下:
<script src="/js/jquery-1.8.0.min.js" type="text/javascript"></script>
<script src="/js/store.js" type="text/javascript"></script>
<script src="/js/jquery.resizableColumns.js" type="text/javascript"></script>
二、TABLE
复制代码代码如下:
<table id="myTable" border="1">
<thead>
<tr>
<th data-resizable-column-id="a"><input type="checkbox" /></th>
<th data-resizable-column-id="b">栏目类型 </th>
<th data-resizable-column-id="c">活动名称 </th>
<th data-resizable-column-id="d">状态 </th>
<th data-resizable-column-id="e">操作选项</t
追问
这个可以拖动，我加上bootstrap的切换卡才不支持拖动的
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
