Tablesorter插件,我不能使它工作



我是一个编程新手,我不知道我的问题可能很简单,但我最近开始学习编程。

对于我的简单应用程序,我想排序表,并有一个搜索框。

我已经尝试下载最新的jquery.tablesorter.js, widgets-filter.js。试着整理一个基本的表格。但我不能让它工作。我无法找到任何样本下载文件,所以我会试着去理解它。在我看到的大多数插件中都有一个可以下载的演示文件夹,里面有插件的基本演示。

对于我的应用程序,我需要根据页面加载和post加载的两列对表进行排序,我必须能够使用搜索框进行搜索。如这里提供的演示https://mottie.github.io/tablesorter/docs/example-widget-filter-any-match.html

我已经尝试查看页面的源代码,并尝试使用相同的插件在那里使用,但我不能使它工作。有没有人能帮我让它工作,告诉我在哪里可以下载一个演示文件夹或类似的东西,这样我就能理解它了

下面是使用带有外部搜索输入的过滤器小部件的简化示例:https://jsbin.com/qahuba/1/edit?html,output

基本HTML

<input type="text" data-column="all" class="search">
<table><!-- thead & tbody required --></table>

基本脚本

<script src="//code.jquery.com/jquery-git.js"></script>
<script src="https://mottie.github.io/tablesorter/js/jquery.tablesorter.js"></script>
<script src="https://mottie.github.io/tablesorter/js/jquery.tablesorter.widgets.js"></script>
<script>
/* Documentation for this tablesorter FORK can be found at
 * http://mottie.github.io/tablesorter/docs/
 */
$(function() {
  $('table').tablesorter({
    theme: 'blue',
    widgets: ['zebra', 'filter'],
    widgetOptions: {
      // jQuery selector string (or jQuery object) of external filters
      filter_external: '.search',
      // If true, a filter will be added to the top of each table column.
      filter_columnFilters: false
    }
  });
});
</script>

注意:在生产中,指向jQuery和您自己的服务器上或从稳定的CDN源(即不是jquery-git.js文件或直接来自github的文件)的表排序文件。

最新更新