Question

我希望看看以下代码是否有更有效的方法：谢谢：）

$( ".menu" ).click(function() {
$( ".submenu" ).slideToggle( "fast", function() {
// Animation complete.
});
});

$( ".menu2" ).click(function() {
$( ".submenu2" ).slideToggle( "fast", function() {
// Animation complete.
});
});

$( ".menu3" ).click(function() {
$( ".submenu2" ).slideToggle( "fast", function() {
// Animation complete.
});
});

Answer 1

$.each([1,2,3], function(index) {
  $( ".menu"+index ).click(function() {
    $( ".submenu"+index ).slideToggle( "fast", function() {
    // Animation complete.
    });
  });
}

Answer 2

你可以使用[Attribute Starts With Selector [name ^ =“value”]]来做这样的事情，并使用类名来获取submenu class 1的公共号。< / p>

$( "[class^=menu]" ).click(function() {
   num = this.className.replace('menu', '')
  $( ".submenu" + num ).slideToggle( "fast", function() {
     // Animation complete.
  });
});

Answer 3

$( ".menu" ).click(function() {
   $( ".submenu" ).slideToggle( "fast", function() {
   // Animation complete.
   });
});

 $( ".menu2,.menu3" ).click(function() {
   $( ".submenu2" ).slideToggle( "fast", function() {
   // Animation complete.
   });
});

Answer 4

好的，感谢那些评论我发现了两种方法来制作更合理的jQuery。谢谢大家的帮助，没有你就不可能做到！

例如，我尝试过Neeraj的例子，但最后一个菜单/子菜单没有用JSBin关闭时出现问题。通过一些试验和错误，似乎通过添加另一个数字（在这种情况下，4），这现在允许菜单/子菜单＃3完美地打开/关闭。不知道为什么，但它对我有用！

$.each([1,2,3], function(index) {
$( ".menu"+index ).click(function() {
$( ".submenu"+index ).slideToggle( "fast", function() {
// Animation complete.
});
});
}

再次感谢！

我还注意到JSBin是一个很棒的工具（它显示了很容易被注意到的红色字体错误）。

当你想“整理”你的代码时，JSfiddle也很棒，真正节省时间！我的网站真的出现了，我感到非常高兴。感谢所有发表评论和举例的人。

如何将多个IF函数与jQuery结合使用？

4 个答案: