Javascript JQuery DataTables列筛选器筛选问题

我正在使用

JQuery DataTables ColumnFilter

插件。我有两个表，当我试图筛选第一个表上的数据时，它正在另一个表中搜索（#示例1），而不是（#示例）

---

你能试着在生活中包装你的代码，看看会发生什么吗！也许这是一个范围冲突！。。差不多

$(function(){

    ;(function(){

    $('#example').dataTable().columnFilter({
        aoColumns: [ {type: "text"},
                 { type: "text" },
                 { type: "text" },
                 { type: "number" },
                 {type: "text"},
                 {type: "text"},
                 {type: "text"},
                 {type: "text"},
                 {type: "text"},
                 {type: "text"},
                 { type: "select", values: [ 'A', 'C', 'U', 'X']  }
            ]

        });

    }());

    ;(function(){

    $('#example1').dataTable().columnFilter({
        aoColumns: [ {type: "text"},
                 { type: "text" },
                 { type: "text" },
                 { type: "number" },
                 {type: "text"},
                 {type: "text"},
                 {type: "text"},
                 {type: "text"},
                 {type: "text"},
                 {type: "text"},
                 { type: "select", values: [ 'A', 'C', 'U', 'X']  }
            ]

        });
    }());

});

---

多张桌子一点问题都没有

确保函数调用中的ID表和ID相同

HTML

---

我认为问题在于版本差异。我已经做了一个有效的例子，所以你可以测试它

以下是对我有用的版本（来自JSFIDLE）：

<link rel="stylesheet" type="text/css" href="http://ajax.aspnetcdn.com/ajax/jquery.dataTables/1.9.0/css/jquery.dataTables.css">
<link rel="stylesheet" type="text/css" href="http://ajax.aspnetcdn.com/ajax/jquery.dataTables/1.9.0/css/jquery.dataTables_themeroller.css">
<script type="text/javascript" charset="utf8" src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.7.1.min.js"></script>
<script type="text/javascript" charset="utf8" src="http://ajax.aspnetcdn.com/ajax/jquery.dataTables/1.9.0/jquery.dataTables.min.js"></script>

您是如何筛选的？您在哪里键入关键字？因为我使用的是dataTable（）.columnFilter，筛选器将应用于具有所有指定列的表尾扫描您生成的显示问题的？它应该是这样工作的。@Raidri我需要上面示例中显示的相同功能，然后从该示例复制代码。如果这不起作用，我们需要从您的页面中看到更多帮助。

<table id="example" cellpadding="0" cellspacing="0" border="0" class="display"  style="width:980px">
    ...
</table>
<table id="example1" cellpadding="0" cellspacing="0" border="0" class="display"  style="width:980px">
    ...
</table>

$(document).ready(function(){
     $('#example').dataTable()
          .columnFilter({
            aoColumns: [ {type: "text"},
                     { type: "text" },
                     { type: "text" },
                     { type: "number" },
                     {type: "text"},
                     {type: "text"},
                     {type: "text"},
                     {type: "text"},
                     {type: "text"},
                     {type: "text"},
                     { type: "select", values: [ 'A', 'C', 'U', 'X']  }
                ]

        });
         $('#example1').dataTable()
          .columnFilter({
            aoColumns: [ {type: "text"},
                     { type: "text" },
                     { type: "text" },
                     { type: "number" },
                     {type: "text"},
                     {type: "text"},
                     {type: "text"},
                     {type: "text"},
                     {type: "text"},
                     {type: "text"},
                     { type: "select", values: [ 'A', 'C', 'U', 'X']  }
                ]

        });
});

<link rel="stylesheet" type="text/css" href="http://ajax.aspnetcdn.com/ajax/jquery.dataTables/1.9.0/css/jquery.dataTables.css">
<link rel="stylesheet" type="text/css" href="http://ajax.aspnetcdn.com/ajax/jquery.dataTables/1.9.0/css/jquery.dataTables_themeroller.css">
<script type="text/javascript" charset="utf8" src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.7.1.min.js"></script>
<script type="text/javascript" charset="utf8" src="http://ajax.aspnetcdn.com/ajax/jquery.dataTables/1.9.0/jquery.dataTables.min.js"></script>