我正在制作一个Jquery移动应用程序,有一个页面有15个左右的div和类,我正在尝试制作一个过滤系统,这样当你按下一个按钮时,这些div中的一些会根据类消失。有3个组,他们都有一个“全部”类来显示所有内容,总共4个类。
不幸的是,即使我为jquery mobile设置了jsfiddle,但我使用的大多数js都不起作用,当我将它放入我的应用程序时,它似乎不起作用。
我想用
function show(target) {
document.getElementsByClassName(target).style.display = 'block';
}
function hide(target) {
document.getElementsByClassName(target).style.display = 'none';
}
但这不起作用,而
document.getElementById
似乎起作用。但是很明显,我只能隐藏/显示每个按钮一个div。。我想知道是否有一个工作,这或完全不同的东西,我应该尝试?
这里有一个关于我所拥有的东西的介绍:http://jsfiddle.net/tzcx7gky/
它在jsfiddle中完全被破坏了,但在我的代码中运行良好,这很奇怪。。
最佳答案
您不需要单独的hide
-show
函数。以下将照顾到所有人。
$('a').on("click",function()
{
$("#scroll_content div").hide(); // initially hide all divs inside the element with id = scroll_content
var target = $(this).text().toLowerCase(); // find the class you wish to show using the text of the a tag clicked ( I would prefer using data-attr in this case but I'll leave the choice upto you.
$("." + target).show(); // show the element with the class target.
});
工作示例:http://jsfiddle.net/tzcx7gky/2/