Question

所以我试图在我的博客上创建一个页面，其中包含我发布的游戏列表，我正在尝试制作一个过滤器，以帮助人们根据类找到游戏。我正在使用onclick =＆＃34; myFuntion（）＆＃34;但出于某种原因，我似乎无法让它发挥作用。我对js很生疏，但我认为逻辑是正确的并且应该正常工作。

java脚本

function allFunction() {
    var filter = document.getElementById("game_filter");

    if (filter.classList.contains("games_all")) {
        element.classList.toggle("game_filter_show", true);
        element.classList.toggle("game_filter_hide", false);
    }
}

function fpsFunction() {
    var filter = document.getElementById("game_filter");

    if (filter.classList.contains("games_fps")) {
        element.classList.toggle("game_filter_show", true);
        element.classList.toggle("game_filter_hide", false);
    } else {
        element.classList.toggle("game_filter_show", false);
        element.classList.toggle("game_filter_hide", true);
    }
}

function survivalFunction() {
    var filter = document.getElementById("game_filter") {

    if (filter.classList.contains("games_survival")) {
        element.classList.toggle("game_filter_show", true);
        element.classList.toggle("game_filter_hide", false); 
    } else {
        element.classList.toggle("game_filter_show", false);
        element.classList.toggle("game_filter_hide", true);
    }
}

据我所知，这应该有效，但事实并非如此，我即将放弃，如果我不能很快解决这个问题就把过滤器留下来。

对不起，如果我将此帖子格式化错误，我对该网站不熟悉。

编辑：这是我想要过滤的HTML项目之一。

<div class="separator" 
id="game_filter"
class="game_filter_show"
class="games_all" 
class="games_fps" 
style="clear: both; text-align: center;">
<a class="GameList" href="http://foo.com" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="http://foo.png /></a></div>

这是按钮的html。

<div style="text-align: center;">
<span style="font-size: large;">
<button onclick="allFunction()">All Games</button>
<button onclick="fpsFunction()">First Person Shooters</button>
<button onclick="survivalFunction()">Survival Games</button>
</span></div>

Answer 1

测试了这段代码并且它看起来有效，除非您想要完成其他任务。

MATCH (a:A)
WHERE NOT (a)-[*]->(:B {prop:false})
RETURN a;

和here是一个展示其运作方式的插图

也许您根据放置在它们上的类来过滤项目，然后

    <div class="games_survival" id="game_filter"></div>
    <div id="element"></div>

    <div onclick="allFunction()">all</div>
    <div onclick="fpsFunction()">fps</div>
    <div onclick="survivalFunction()">survivval</div>

<script>
var element = document.getElementById("element");
function allFunction() {
    var filter = document.getElementById("game_filter");

    if (filter.classList.contains("games_all")) {
        element.classList.toggle("game_filter_show", true);
        element.classList.toggle("game_filter_hide", false);
    }
}

function fpsFunction() {
    var filter = document.getElementById("game_filter");

    if (filter.classList.contains("games_fps")) {
        element.classList.toggle("game_filter_show", true);
        element.classList.toggle("game_filter_hide", false);
    } else {
        element.classList.toggle("game_filter_show", false);
        element.classList.toggle("game_filter_hide", true);
    }
}

function survivalFunction() {
    var filter = document.getElementById("game_filter") ;

    if (filter.classList.contains("games_survival")) {
        element.classList.toggle("game_filter_show", true);
        element.classList.toggle("game_filter_hide", false); 
    } else {
        element.classList.toggle("game_filter_show", false);
        element.classList.toggle("game_filter_hide", true);
    }
}
</script>

和另一个plunker 编辑：删除games_all类检查，或者你可以添加games_all o列表中的每个项目，但这会更容易。

JS班级列表不起作用

1 个答案: