javascript - 使用切换类更改 div 的跨度时出现问题

Question

我正在使用蓝图 CSS 框架。我有一篇跨越 24 列的文章，但我尝试使用 jQuery toggleclass ( onclick) 将其减少到 20 列，并在剩余 4 列中显示操作按钮。

$("div").each(function() {
  $(this).click(function() {
   $(this).toggleClass("span-24"); 
   $(this).toggleClass("span-20");
  });
});

我有多个 div，所以我使用每个，但它不起作用。

我很感激任何帮助。

score 1 · Accepted Answer

您可以在没有循环的情况下将点击事件绑定到所有 div each。此外，您可以使用:gt() 大于选择器，然后使用这些跨度toggle() 的可见性

$("div").click(function() {
    $(this).find("span:gt(19)").toggle();
});

score 1 · Accepted Answer

这段代码应该做你所追求的：

$("div").toggle(function() {
    $(this).attr("class", "span-24");
}, function() {
    $(this).attr("class", "span-20");
});

score 0 · Accepted Answer

你不想切换divs你所拥有的所有课程，而只想切换有内容的课程
您甚至可以进一步简化此代码：

$('#toggler').click(function(){ $('#content').toggleClass('span-20 span-24'); });

这#toggler.click()只是可以运行的事件之一toggleClass()，在您的 HTML 中它可以是 onload 或其他：

$('#content').toggleClass('span-20 span-24'); //main code (and all of it, too)

score 0 · Accepted Answer

0

你也可以这样做：

$("div").click(function() { $(this).toggleClass("span-20 span-24"); });

于 2011-01-03T18:48:35.467 回答

4 回答 4