Question

我有一张表，其中不同的列用不同的类标识。

我还有一个绑定到每一列的复选框。

我创建了一个在单击任何复选框时调用的函数。在此函数中，我隐藏/显示与此链接的列。

它没有任何javascript错误，代码如下：

$(document).ready(function(){
        $('ul input').click(function(){
            //alert('yooo');
            if ($(this).is(':checked')) {
                //alert('checked');
                $("td."+replaceAll(" ","_",$(this).val())).show();
                $("th."+replaceAll(" ","_",$(this).val())).show();
                //alert($("td").length);
            }
            else{
                //alert('unselected');
                $("td."+replaceAll(" ","_",$(this).val())).hide();
                $("th."+replaceAll(" ","_",$(this).val())).hide();
            }
        });
    });

但是，每次点击后，操作都会有一个延迟（经过多次点击后，它变得太慢，很多秒）。

我也尝试使用.css而不是hide-show，但它没有做任何改变。

Answer 1

我知道问题只与复选框相关联，而不是在回调或jquery函数上。我只是通过使用无线电输入，添加一个＆＃34; true＆＃34;和＆＃34;假＆＃34;页面中每个复选框的无线电输入。

Answer 2

而不是像下面的每次点击运行jQuery选择器：

    $("td."+replaceAll(" ","_",$(this).val()))

您可以设置某种缓存，例如：

    var cache = {} //<-- declare this outside your click handler

    //add the code below inside your click handler
    className = replaceAll(" ","_",$(this).val())
    if(!cache[className])
        cache[className ] = $("td."+className + ", th."+className); //select all the elements once and store in the cache object
    $el = cache[className];
    if ($(this).is(':checked'))
        $el.show();
    else
        $el.hide();

Jquery滞后于点击功能

2 个答案: