在jquery中使用jquery插件

时间:2017-02-22 12:47:43

标签: javascript jquery

我正在尝试在jQuery代码中使用jQuery插件。该插件用于过滤表数据。可以找到插件演示here

现在,我想将插件与jQuery中创建的表一起使用。我正在尝试使用addClass()方法和attr()方法添加插件。但它不起作用。我不知道如何在我的代码中使用该插件。

<script>
$('#filter_table').append('<table>').addClass("js-dynamitable").append('<thead>');

    for(i=0;i<2;i++)
    {
        $('#filter_table').append( '<tr>');
        if(i==0)
        {
            $('#filter_table').append( '<th style="color: red;"> Name <span class="js-sorter-desc"></span> <span class="js-sorter-asc"></span> </th>');
            $('#filter_table').append( '<th style="color: red;"> Email <span class="js-sorter-desc"></span> <span class="js-sorter-asc"></span> </th>');
            $('#filter_table').append( '<th style="color: red;"> Age <span class="js-sorter-desc"></span> <span class="js-sorter-asc"></span></th>');
        }
        else if(i==1)
        {
            $('#filter_table').append( '<th> <input>').attr('class','js-filter');
            $('#filter_table').append('</th>');
            $('#filter_table').append( '<th> <select class="js-filter"> <option value=""></option> <option value="@gmail.com">Gmail</option> <option value="@yahoo.com">Yahoo</option> <option value="@rediff.com">Rediff</option> </select></th>');
            $('#filter_table').append( '<th> <input  class="js-filter" type="text" value=""> </th>');
        }
        $('#filter_table').append('</tr>');
    }
    $('#filter_table').append('</thead> <tbody>');
    for(i=0;i<2;i++)
    {
        $('#filter_table').append( '<tr>');

        {
            $('#filter_table').append( '<td> Rohit </td>');
            $('#filter_table').append( '<td> Rohit@gmail.com </td>');
            $('#filter_table').append( '<td> 18 </td>');
        }
        $('#filter_table').append('</tr>');
        $('#filter_table').append('<tr>');
        {
            $('#filter_table').append( '<td> Ryan </td>');
            $('#filter_table').append( '<td> Ryan123@yahoo.com </td>');
            $('#filter_table').append( '<td> 32 </td>');
        }
        $('#filter_table').append('</tr>');
    }
    $('#filter_table').append('</tbody></table>');  
    </script>

1 个答案:

答案 0 :(得分:-1)

尝试

$('#filter_table').append('<table><thead>');
$('#filter_table').addClass("js-dynamitable");

而不是

$('#filter_table').append('<table>').addClass("js-dynamitable").append('<thead>')