javascript - 使用 jQuery 添加/删除 css 类以通过 css 类识别元素

标签 javascript jquery html css jsp

我在下面有一个 javascript/jQuery 函数:

    function hideShowHiddens(action){
        $('.hidden_col').each(function(){
            if(action == 'show'){
                this.removeClass("hidden");
            }else{
                this.addClass("hidden");
            }
        });
    }

它应该做的是为带有空标记 css '.hidden_​​col' 的每个元素搜索 jsp。然后根据输入的参数,它将添加或删除另一个名为“.hidden”的 css 类,它实际上隐藏了元素。

此方法理想情况下可为我节省 400 行 javascript 函数,这些函数对于我需要处理的数据量来说太慢了。但是,当它运行时,我从浏览器中收到一条错误消息,提示它不支持此方法。谁能告诉我为什么这不起作用或如何解决它?

最佳答案

.addClass().removeClass() 是 jQuery 函数。 jQuery 对象是标准 DOM 对象的超集。您需要包装 DOM 对象以创建 jQuery 对象。然后功能就可以访问了。

function hideShowHiddens(action){
    $('.hidden_col').each(function(){
        if(action == 'show'){
            $(this).removeClass("hidden");
        }else{
            $(this).addClass("hidden");
        }
    });
}

示例: JSFiddle

替代方案:

这是一个更短、更甜美的替代方案。

function hideShowHiddens(action){
    (action === "show") ? $('.hidden_col').show() : $('.hidden_col').hide();
}

关于javascript - 使用 jQuery 添加/删除 css 类以通过 css 类识别元素,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23552365/

相关文章:

javascript - 如何解决另一个 promise 中的 promise 并在 Controller 中获得解决方案?

javascript - 工厂、服务和依赖注入(inject)在 angular.js 中到底意味着什么

javascript - 视频自动播放,没有自动播放和自动启动属性

javascript 闭包和对象引用

javascript - 无法在 asp mvc 中验证 TinyMCE

javascript - 与过多的递归作斗争

html - 如何在 css-transform scale 操作中保持空格换行

javascript - 在这些条件下使用 Javascript 或 jquery 滚动到页面底部

html - 是否有可能禁用 <datalist> 中的用户输入?

javascript - 确定弹出窗口的关闭方式