javascript - Jquery自定义编写选择器

标签 javascript jquery

今天我一直在尝试用各种方法解决以下问题。我已经花了几个小时在上面,但我似乎不知道该怎么做。

基本问题是这样的:我有一堆 JavaScript 逻辑正在计算以下变量应该是 1 还是 0。

1)active
2)alternative
3)classic
4)vintage
etc.... 

所有这些变量在我的设计中本质上都充当过滤器的作用。我需要它们来确定是否应该展示产品。因此,一旦确定了这些值,我想通过附加或删除 CSS 类(我们称之为 .style)来相应地显示产品样式(或隐藏产品样式)。每个产品都附有 1 个或多个过滤器。因此,就像一双鞋子可能是经典和替代品一样,在这种情况下,经典或替代变量中的 1 应该会导致鞋子显示该款式。

实现此显示方面的最佳方式是什么?我正在考虑编写一个自定义选择器,但我很难弄清楚如何编写它。

类似...

if($(".divProducts").hasClass(active) || $(".divProducts").hasClass(alternative) || etc..)
{
 ....?
}

但我并没有以这种方式走得太远,因为首先,即使 IF 语句子句解析正确,我也不知道哪个产品实际上在替代或事件或任何其他过滤器中返回了 1。

这确实很难解释。

TLDR;基本上我需要这个:

如果某个 div 容器中的任何元素具有任何值为 1 的过滤器,请将 .style 应用于每个元素。

非常感谢您的帮助,因为这实际上是明天到期的项目的一部分...我没想到会遇到这么困难:\

顺便说一句,产品会跟踪具有类别的过滤器。例如 鞋类产品->

<div class="blah blah vintageFilter blah blah">...</div>

如果 vintage 变量为 1,我想将 .style 类应用于此 div。有意义吗?

最佳答案

我认为这种方法会更具可读性并且更易于管理

 switch(true) {

 case $('.divProducts').hasClass(active) :
     // some action
 break;

 case $(".divProducts").hasClass(alternative) :
    // some action
 break;

 default :
 //some action

}

关于javascript - Jquery自定义编写选择器,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17738024/

相关文章:

javascript - 对象的全局变量

javascript - 当到达 "0"时停止倒计时

javascript - 设置div位置固定不跳页

php - 如何在不刷新页面的情况下更新 HTML data-* 属性

javascript - 如何使用 jQuery 平滑地更改 <img src ="..."/>?

javascript - 正则表达式无法删除字符串/其他内容

javascript - 上传前检测文件大小问题

javascript - Bootstrap : Responsitive design - execute JS when window is resized from 980px to 979px

javascript - 按钮需要点击两次(Jquery)

javascript - (jQuery) 使用 extend() 访问自定义属性时出现问题