所以我有这个想法,我正在 Codepen 上研究。我已经让它按原样工作,但在我去添加更多可点击区域之前,我已经意识到重构和干燥东西的巨大需求。到目前为止它可以工作,但它非常丑陋,并且会涉及大量重复代码。
所以我试图用一个使用 $(this) 填充的 switch 语句替换许多 $(.class).click(function() { ... });
函数一个 .click 函数代替。但是我迷路了。
您可以在此处查看所有内容并进行编辑:http://codepen.io/lukewatts/pen/ubtmI
我觉得我很接近,但我碰壁了。顶部注释掉的部分是 DRY 尝试,而现在未注释掉的是工作版本。单击最小、关闭、最大字词或 LED 以查看其工作情况。
非常感谢您对此提出的任何建议。老实说,PHP 是我的主要语言。
附言我有 leds.click(function() { ... })
并将其替换为 leds.on(function() { ... })
但仍然没有.
最佳答案
我明白你想做什么,但不是 jQuery 对象的工作原理。为了检查对象是否匹配选择器,您必须使用 .is()
。 .
因此,您将无法使用 switch
,但您必须使用一系列链式 if
来实现您的目标尝试,例如
if ( $this.is('.led[data-level="one"]') )
var led = $('p.min a');
var level = "one";
我已将您的 CodePen 示例更新为以这种方式工作: Codepen
不过,正如我在对问题的评论中提到的,我不会在这里进行任何代码审查,只是修复对您不起作用的部分。老实说,我不确定这实际上是比您的凌乱原始方法更好的方法。
关于javascript - 重构 jQuery 以使用 $(this) 并从另一个元素添加/删除类,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18917617/