0

我已经成功实现了多个条件三元运算符来在水平和垂直之间打乱类，如下所示：

jQuery：

<script type="text/javascript">
  $(document).ready(function() {
      $("#my_div")
     .removeClass("horizontal vertical")
     .addClass( ['red', 'blue', 'green', 'gray'].indexOf(my_color) != -1 ? 'horizontal' : 'vertical');
});
</script>

my_color 可能同时具有红色、蓝色、绿色、灰白色和黑色中的一个值。如上所述，类horizontal设置为前 4 个my_color值和vertical其他值。现在我想添加和删除第三类elliptical，其中水平、垂直和椭圆设置仅为 my_color 的 2 个值。如何修改上面的脚本或使用 switch 语句实现相同的脚本？

4

1 回答 1

1

您可以使用带开关的toggleClass轻松添加/删除类：

$(document).ready(function() {
   var colors = ['red', 'blue', 'green', 'gray'];
   $("#my_div")
      .toggleClass('horizontal', colors.indexOf(my_color) != -1)
      .toggleClass('vertical', colors.indexOf(my_color) == -1)
      .toggleClass('elliptical', [colors[0], colors[1]].indexOf(my_color) != -1);
});

如果颜色与数组匹配，则添加第一类，如果不匹配则删除，第二类相反，如果颜色与第一个或第二个数组值匹配，则添加第三类。并非所有浏览器都支持 array.indexOf，您可能应该使用 polyfill。

于 2013-01-31T15:37:44.650 回答