0

私は4日間プロジェクトに取り組んでおり、完全に手書きで、javascriptを使用して現在の場所を確認しています（コードアカデミーのコースを受講しています）。ブラウザベースのチェックリストプログラムを作成しようとしています。これまで、を動的に作成できるクリーンなメニューインターフェイスを作成しまし<div>た。

これが私がjsfiddleで得たものです：http：
//jsfiddle.net/SdCaf/1/

私の質問：

  • taskToggle()関数をより効率的に書くことはできますか？それを単純化するjqueryの方法はありますか？

  • Fiddleで私のコードを調べる時間があれば; mysqlに簡単にアクセスできますか、それとも更新が困難になる、間抜けな冗長な応急修理を作成しましたか？

  • 修正済みコンストラクターがチェックボックスと説明を追加し ないのはなぜですかformatTask()（if / elseに見られるように）-taskToggle()関数に何か問題がありますか、追加しようとしているチェックボックス<div>、両方、または他の何かですか？

formatTask()コンストラクター：

function formatTask(target, divId, content, description, complete) {

    function taskToggle() {
        if ($(this).hasClass("completeTask")) {
            $("#" + divId).attr("class", "incompleteTask");
            $("#" + divId + "Box").attr("class", "incompleteBox");
        }
        else if ($(this).hasClass("incompleteTask")) {
            $("#" + divId).attr("class", "completeTask");
            $("#" + divId + "Box").attr("class", "completeBox");
        }
    };

    if (complete) {
        var div = new formatDiv(target, divId, "completeTask", content, taskToggle, description);
        formatDiv(divId, divId + "Box", "completeBox", "O");
        div.addDescription();
    }
    else {
        var div = new formatDiv(target, divId, "incompleteTask", content, taskToggle, description);
        formatDiv(divId, divId + "Box", "incompleteBox", "[ ]");
        div.addDescription();
    }
}

formatDiv(divId, divId + "box", "completeBox", "O");呼び出すと、すべてのパラメーターを受け入れているようで、コンソールでエラーは発生しませんが、実行されていないようですdiv.addDescription。Fiddleの結果ペインで[»リストの表示]をクリックすると、これを自分で確認できます（関数がどのように.addDescription()機能するかの例が表示されます） 。

あなたが提供したいと思うかもしれない他のフィードバックは大歓迎です。私は自分が正しい方向に進んでいるかどうか、またはエレガントでなくなるジャンキーなコードを書き始めているかどうかを知る必要があります。
よろしくお願いします！

4

3 に答える 3

1

あなたがこれを言うとき、あなたはそれを確信しています：

$("#" + divId).attr("class", "incompleteTask");

これじゃないの？

$("#" + divId).addClass("incompleteTask");
$("#" + divId).removeClass("completeTask");
于 2012-07-24T05:41:54.367 に答える
1

ここでの問題は、タスクに割り当てているDOMIDが「atask！」であるということです。これは（！のために）無効な文字です。IDとクラス名から無効な文字を必ず削除してください。

于 2012-07-24T06:52:35.007 に答える
0

taskToggle（）をformatTask（）から分離し、次のようにformatTask（）でtaskToggle（）を呼び出すだけです。

function formatTask(target, divId, content, description, complete) {

 taskToggle();

 if (complete) {
    var div = new formatDiv(target, divId, "completeTask", content, taskToggle, description);
    formatDiv(divId, divId + "Box", "completeBox", "O");
    div.addDescription();
}
else {
    var div = new formatDiv(target, divId, "incompleteTask", content, taskToggle, description);
    formatDiv(divId, divId + "Box", "incompleteBox", "[ ]");
    div.addDescription();
}


}

function taskToggle() {
    if ($(this).hasClass("completeTask")) {
        $("#" + divId).attr("class", "incompleteTask");
        $("#" + divId + "Box").attr("class", "incompleteBox");
    }
    else if ($(this).hasClass("incompleteTask")) {
        $("#" + divId).attr("class", "completeTask");
        $("#" + divId + "Box").attr("class", "completeBox");
    }
};
于 2012-07-24T04:49:42.233 に答える