OnClick事件不适用于超过10个条目的值

时间:2015-03-16 17:38:28

标签: javascript yadcf

Javascript - yadcf过滤器OnClick事件在以后不起作用:

  • 10行条目后
  • 在这种情况下:你加载html页面,你有1-10个条目之间的X1标签和10个条目后的X2标签。如果使用 X 进行onclick事件过滤进行过滤,则:如果使用onclick事件,则X1标记正在运行,但如果使用onclick事件则X2不起作用,因为X2最初是在加载页面html,超过10个条目

enter image description here

这是我的javascript代码:

    var oTable;
$(document).ready(function(){
  oTable = $('#example').dataTable().yadcf([
                {column_number : 0},
            {column_number : 3,  filter_type: "range_number_slider", filter_container_id: "external_filter_container"},
            {column_number : 2, text_data_delimiter: ",", filter_type: "auto_complete"},
            {column_number : 1, text_data_delimiter: ",", filter_type: "auto_complete"},
            {column_number : 4, column_data_type: "html", html_data_type: "text", filter_default_label: "Select tag", filter_type: "auto_complete"}]);

 $(".label.lightblue" ).on( "click", function() {
      yadcf.exFilterColumn(oTable, [[4, $(this).text()]]);

    });

        $(".label4.lightblue4" ).on( "click", function() {
      yadcf.exFilterColumn(oTable, [[4, $(this).text()]]);

    });

     $(".label2.lightblue2" ).on( "click", function() {
      yadcf.exFilterColumn(oTable, [[2, $(this).text()]]);

    });
});

jsfiddle上的实例:http://jsfiddle.net/chcLmmps/

1 个答案:

答案 0 :(得分:2)

标签(标签)是动态添加的,因此它们没有附加事件。而不是像.click()那样使用.on

$('#example').on('click',".label.lightblue", function () {
    alert('onclick label');
    yadcf.exFilterColumn(oTable, [
        [4, $(this).text()]
    ]);
});

.label4.lightblue4.label2.lightblue2

的方式相同

这是DEMO

希望这有帮助。