0

ドイツ語の学習に役立つ単語ゲームを作成しています。ドイツ語用と英語用の 2 つの配列があります。次に、すべての単語を「言語」と「位置」のクラスを持つリンクとして HTML ページに表示します。これは、間にスペースを入れた数字です。私が望むのは、ドイツ語と英語の単語がペアになったときにフェードアウトすることです。これは私がこれまでに持っているクリックイベントです:

function setup()
{
    var check = { language: undefined, position: null };

    $("a").on("click", function()
    {
        var attributes = $(this).attr("class").split(" ");

        if (attributes[0] == "german") {
            if (check["language"] == "german") {
                alert("German word already clicked!");
                check["language"] = undefined;
                check["position"] = null;
                return;
            }

            if (check["language"] == "english") {
                if (check["position"] == attributes[1]) {
                    $(this).fadeOut(800);
                }
            }

            check["language"] = attributes[0];
            check["position"] = attributes[1];
        }

        if (attributes[0] == "english") {
            if (check["language"] == "english") {
                alert("English word already clicked!");
                check["language"] = undefined;
                check["position"] = null;
                return;
            }

            if (check["language"] == "german") {
                if (check["position"] == attributes[1]) {
                    $(this).fadeOut(800);
                }
            }

            check["language"] = attributes[0];
            check["position"] = attributes[1];
        }
    });
}

編集:

function wordlist(obj)
{
    for (i = 0; i < obj["wordlist"].length; i ++) {
        $("#main .span12").append("<a href=\"#\" class=\"" + obj["language"] + " " + i + "\">" + obj["wordlist"][i] + "</a><br/>");
    }
}

完全開示:

私は言葉遊びを終えたので、最終版を提出して他の人が使用できるようにすることで、コミュニティに恩返しをすることにしました。ゲームは、ランダム化された単語リストもサポートしており、その後一緒にマージされます。コードを改善できると思われる場合は、コメントしてください。

$(document).ready(function()
{
    (function training()
    {
        Array.prototype.shuffle = function()
        {
            var i = this.length, j, temp;
            if (i == 0) return this;

            while (--i) {
                j = Math.floor(Math.random() * (i + 1));
                temp = this[i];
                this[i] = this[j];
                this[j] = temp;
            }
            return this;
        }

        var german =
        {
            language: "german",
            wordlist:
            [
                "der Zusammenhang",
                "der Wirt",
                "der Kaufmann",
                "das Gesetz",
                "(sich) klammern (an)",
                "der Lastwagen",
                "die Akte",
                "das Gericht",
                "zahlen",
                "zählen (bis, auf)"
            ]
        },
        english =
        {
            language: "english",
            wordlist:
            [
                "connection",
                "landlord",
                "dealer",
                "law",
                "to attach (to)",
                "truck",
                "file",
                "dish",
                "to pay",
                "to count (to, on)"
            ]
        };

        function generate(obj)
        {
            var array = [];

            for (i = 0; i < obj["wordlist"].length; i ++) {
                array.push("<a href=\"#\" class=\"" + obj["language"] + " " + i + "\">" + obj["wordlist"][i] + "</a><br/>");
            }
            return array;
        }

        var german = generate(german);
        var english = generate(english);

        var wordlist = german.concat(english);
        wordlist.shuffle();

        $("#main .span12").append(wordlist);

        (function setup()
        {
            var check = { language: undefined, position: null };

            $("a").on("click", function()
            {
                var attributes = $(this).attr("class").split(" ");

                if (attributes[0] == "german") {
                    if (check["language"] == "german") {
                        alert("    German word clicked!\nPlease click an English word.");
                        check["language"] = undefined;
                        check["position"] = null;
                        return;
                    }

                    if (check["language"] == "english") {
                        if (check["position"] == attributes[1]) {
                            $("." + attributes[1]).fadeOut(800);
                            $("." + attributes[1]).remove();
                        }
                    }

                    check["language"] = attributes[0];
                    check["position"] = attributes[1];
                }

                if (attributes[0] == "english") {
                    if (check["language"] == "english") {
                        alert("      English word clicked!\nPlease click a German word.");
                        check["language"] = undefined;
                        check["position"] = null;
                        return;
                    }

                    if (check["language"] == "german") {
                        if (check["position"] == attributes[1]) {
                            $("." + attributes[1]).fadeOut(800);
                            $("." + attributes[1]).remove();
                        }
                    }

                    check["language"] = attributes[0];
                    check["position"] = attributes[1];
                }
            });

            (function loop()
            {
                var timer = setTimeout(loop, 1000);
                var links = $("a");

                if (links.length == 0) {
                    clearTimeout(timer);
                    alert("Well done!");
                    return;
                }
            })();
        })();
    })();
});
4

2 に答える 2

0

交換する

$(this).fadeOut(800);  

$("."+attributes[1]).fadeOut(800); 
OR
$("."+check["position"]).fadeOut(800);
于 2013-07-24T09:47:16.273 に答える