通过与jQuery相同类的对象循环？

我有一些按钮，每个都有一类“全屏按钮”，我打算用来显示/隐藏页面上的内容。这些按钮都有id，它们是学校程序的名称，并且页面上的每个按钮都有div，它们与id相匹配的类（一个id为“编程”的按钮和一个具有“编程”类的相应div，等等）。通过与jQuery相同类的对象循环？

我现在的目标是在点击一个按钮时，通过为该div设置一个可以显示样式的类来隐藏具有与点击的按钮的id相匹配的类的div。

我写了一些jQuery，我期望这样做，但它只能设法为第一个按钮工作，所以我知道我错了某处。这是我在这一点上...

$('.fullscreen-button').each(function(i,elm) { 
    programTitle = $(elm).attr("id"); 
     $(elm).click(function(){ 
      $('.program-collector div').each(function(j,pelm) { 
       if ($(pelm).hasClass(programTitle)) { 
        $(pelm).addClass("hidden"); 
       } 
      }); 
     }) 
    });

那么，如何通过适当的所有按钮和申报单的做我居然循环？

来源

2015-10-06 John Doe

如果你可以做一个[的jsfiddle（https://jsfiddle.net）它使人们更方便的为您解答。 – arcyqwerty

很难知道只有JS有什么问题，但不知道它工作的HTML。请将您的HTML添加到问题中（或者更好，根据@ arcyqwerty的建议创建一个小提琴） – ochi

这应该是简单的解决您的问题。

如果点击与fullscreen-button类的元素，然后匹配.program-collector div.{button-id}任何元素将被隐藏（其中button-id是点击.fullscreen-button元件的id属性）。

注意$(selector).hide()自动应用display: none

$('.fullscreen-button').click(function(){ 
    $('.program-collector div.' + $(this).attr('id')).hide(); 
});

我说的简单，因为它会为最明智的网页的工作。理论上你可能有一个id/class名称，这会导致在jQuery选择器中使用的问题，并且需要转义。

来源

2015-10-06 20:46:14 arcyqwerty

非常感谢您的洞察力。我只是用任何适用的代码去创建一个[JSFiddle]（https://jsfiddle.net/79yay958/2/）。你的解决方案在我的JSFiddle上替换我的jQuery时使用了Game Design按钮。在这种情况下间距会成为问题吗？我也在控制台中得到一个无法识别的表达错误（无法识别的表达式：.program-collector div.Acting For Television），并且该功能与新代码无法正常工作。它是一个远射，但我想知道是否有足够简单的修复方法来基于该警告找到？ –

这是因为“游戏设计”实际上被解释为两个类“游戏”和“设计”。我建议使用短划线或其他分隔符。所以是的，这是一个空白问题。 – arcyqwerty

无法重现您的控制台错误。你正在运行一些不同的代码？在小提琴中我没有看到任何提及“电视”的东西。 – arcyqwerty

通过与jQuery相同类的对象循环？

回答

相关问题