我的datatable插件不工作,我不知道为什么请帮助...
当试图调试谷歌crome上的javascript时,我发现了这个错误,我知道它们是否冲突
未捕获引用错误:jQuery未定义localhost:49769/Scripts/main.js:1未捕获错误:没有找到图形容器元素localhost:49769/Scripts/Template/js/plugins/morris/morris.min.js:1“范围.分离”现在是一个无操作,根据DOM(http://dom.spec.whatwg.org/#dom-range-detach)。
我正在使用MVC 5开发应用程序
这是主要的
jQuery(function ($) {
$(document).ready(function () {
var table = $("#customers").DataTable();
});
});
<!-- add new calendar event modal -->
<!-- jQuery 2.0.2 -->
<script src="/Scripts/Template/js/jquery-1.11.1.min.js"></script>
<script src="/Scripts/Template/js/jquery.min.js"></script>
<script src="/Scripts/main.js"></script>
<!-- DATA TABES SCRIPT -->
<script src="/Scripts/Template/js/plugins/datatables/jquery.dataTables.js"></script>
<!-- jQuery UI 1.10.3 -->
<script src="/Scripts/Template/js/jquery-ui-1.10.3.min.js" type="text/javascript"></script>
<!-- Bootstrap -->
<script src="/Scripts/Template/js/bootstrap.min.js" type="text/javascript"></script>
<!-- Morris.js charts -->
<script src="/Scripts/Template/js/raphael-min.js"></script>
<script src="/Scripts/Template/js/plugins/morris/morris.min.js" type="text/javascript"></script>
<!-- Sparkline -->
<script src="/Scripts/Template/js/plugins/sparkline/jquery.sparkline.min.js" type="text/javascript"></script>
<!-- jvectormap -->
<script src="/Scripts/Template/js/plugins/jvectormap/jquery-jvectormap-1.2.2.min.js" type="text/javascript"></script>
<script src="/Scripts/Template/js/plugins/jvectormap/jquery-jvectormap-world-mill-en.js" type="text/javascript"></script>
<!-- jQuery Knob Chart -->
<script src="/Scripts/Template/js/plugins/jqueryKnob/jquery.knob.js" type="text/javascript"></script>
<!-- daterangepicker -->
<script src="/Scripts/Template/js/plugins/daterangepicker/daterangepicker.js" type="text/javascript"></script>
<!-- datepicker -->
<script src="/Scripts/Template/js/plugins/datepicker/bootstrap-datepicker.js" type="text/javascript"></script>
<!-- Bootstrap WYSIHTML5 -->
<script src="/Scripts/Template/js/plugins/bootstrap-wysihtml5/bootstrap3-wysihtml5.all.min.js" type="text/javascript"></script>
<!-- iCheck -->
<script src="/Scripts/Template/js/plugins/iCheck/icheck.min.js" type="text/javascript"></script>
<!-- AdminLTE App -->
<script src="/Scripts/Template/js/AdminLTE/app.js" type="text/javascript"></script>
<!-- AdminLTE dashboard demo (This is only for demo purposes) -->
<script src="/Scripts/Template/js/AdminLTE/dashboard.js" type="text/javascript"></script>
<!-- AdminLTE for demo purposes -->
<script src="/Scripts/Template/js/AdminLTE/demo.js" type="text/javascript"></script>
<script src="/Scripts/modernizr-2.6.2.js"></script>
这是我所有脚本参考
这是表
<section class="content">
<div class="row">
<div class="col-xs-12">
<div class="box">
<br />
<div class="box-header row-fluid">
<div class="col-lg-12">
<div class="span2 pull-right">
<button class="btn btn-primary btn-sm">Enable</button>
<button class="btn btn-warning btn-sm">Disable</button>
<button class="btn btn-danger btn-sm">Delete</button>
</div>
</div>
</div><!-- /.box-header -->
<div class="box-body table-responsive">
<table id="customers" class="table table-bordered table-striped">
<thead>
<tr>
<th><input type="checkbox"></th>
<th>Customer Name</th>
<th>Phone Number</th>
<th>Email</th>
<th>Location</th>
<th>Registration Date</th>
<th>Customer Status</th>
</tr>
</thead>
<tbody>
<tr>
<th><input type="checkbox"></th>
<td>Mike Ebon</td>
<td>0802647281243</td>
<td>mike@yahoo.com</td>
<td>Surulere Lagos, Country</td>
<td>10/13/2014</td>
<td><span class="label label-success">Approved</span></td>
</tr>
<tr>
<th><input type="checkbox"></th>
<td>Mike Ebon</td>
<td>0802647281243</td>
<td>mike@yahoo.com</td>
<td>Surulere Lagos, Country</td>
<td>10/13/2014</td>
<td><span class="label label-success">Approved</span></td>
</tr>
<tr>
<th><input type="checkbox"></th>
<td>Mike Ebon</td>
<td>0802647281243</td>
<td>mike@yahoo.com</td>
<td>Surulere Lagos, Country</td>
<td>10/13/2014</td>
<td><span class="label label-danger">Denied</span></td>
</tr>
</tbody>
</table>
</div><!-- /.box-body -->
</div><!-- /.box -->
</div>
</div>
</section>
2条答案
按热度按时间sqyvllje1#
在包含jQuery的脚本标记之前或之后有这个标记吗?确保它在之后。
jgwigjjp2#
根据Datatables.net
DataTables只有一个库依赖项作为一个jQuery插件,DataTables利用了jQuery提供的许多优秀特性,并以与所有其他jQuery插件相同的方式连接到jQuery插件系统中。jQuery 1.7或更新版本将使用DataTables,但通常您会希望使用最新版本。DataTables包含了它运行所需的所有其他内容。
请将jQuery更新为最新版本,然后重试。
你不需要它。