0 
var foo = true;

// foo here is not being updated when set to false
if(foo) {
    // and this will always work
    $("#bar").on("click", function() {
        alert("hello");
    });
}

$("#set").on("click", function() {
    alert("foo is now false");
    foo = false;
});

<p id="bar">bar</p>
<input type="button" id="set" value="set to false" />

if(foo)関数内に配置すると、正常に動作します。

しかし、ここでの状況は、複数のマウス操作でチェックする条件がさらにあるということifです。各アクションに対して同じチェックを記述する必要があります...

$("#bar").on("mouseover", function() {
    if(foo && bar && baz && qux) {
        // do job A
    }
}).on("mouseout", function() {
    if(foo && bar && baz && qux) {
        // do job B
    }
}).on("click", function() {
    if(foo && bar && baz && qux) {
        // do job C
    }
}).on("dblclick", function() {
    if(foo && bar && baz && qux) {
        // do job D
    }
});

ifでは、これを機能させるために、更新された foo を使用して 1 回だけ書き込むにはどうすればよいでしょうか。ここでフィドル

4

4 に答える 4

2

クリック ハンドラー内で if 条件を移動します。

$("#bar").on("click", function() {
    if(foo) { alert("hello");}
});

jsFiddle の例

.on()すべてのイベントで条件が同じである場合は、次のように呼び出しでイベントをつなぎ合わせることができます。

$('#bar').on('mouseover mouseout click dblclick', function(e) {
    if(foo && bar && baz && qux) {
        switch(e.type){
            case 'mouseover':
                // thing 1
            break;
            case 'mouseout':
                // thing 2
            break;
            case 'click':
                // thing 3
            break;
            case 'dblclick':
                // thing 4
            break;
        }
    }
 });
于 2013-02-13T17:02:16.260 に答える
2

あなたはこのようにする必要があります：

var foo = true;

var check = function() {
     if(foo === true) //Add here your multiple checks
         return true;
    else
        return false;
}

$("#bar").on("click", function() {
    if(check())
        alert("hello");
});

$("#set").on("click", function() {
    alert("foo is now false");
    foo = false;
});

更新されたfiddleを参照してください。

jquery は解析されず、関数を実行するだけなので、関数内の var をチェックするか、新しい関数を実行してグローバル var をチェックする必要があります。

于 2013-02-13T17:02:16.170 に答える
0

まあ...ifイベントハンドラー内に複数の条件を入れることだけが選択肢ではありません。

ここでは、イベント ハンドラーを関数内にラップし、@jfriend00 が提案したように、 set のときにoffonを呼び出しました。また、イベント ハンドラーの再アクティブ化 (再バインド) を示すために、元に戻す別のボタンを追加しました。#barfoo=falsefootrue

var foo = true;

function bar() {
    if(foo) {
        $("#bar").on("click", function() {
            alert("hello");
        })/*.on("mouseover/dblclick/...")*/;
    }
}
bar();

$("#set_false").on("click", function() {
    alert("foo is now false");
    foo = false;
    // unbind mouse actions
    $("#bar").off();
});

$("#set_true").on("click", function() {
    alert("foo is now true");
    foo = true;
    // re-activate mouse actions
    bar();
});

フィドル: http://jsfiddle.net/AT6RT/7/

于 2013-02-13T18:42:02.947 に答える
0

最初のコード例ではif (foo)、各クリック時ではなく、初期化時にのみ評価されるため、もちろん、初期化時にfooコードが実行されるときの値にのみ作用します。イベント時にの値をチェックする場合foo、イベント時に実際に実行される唯一のコードであるため、チェックはイベント ハンドラー内にある必要があります。

次の選択肢があります。

  1. 1 セットのイベント ハンドラーを作成し、foo各イベント ハンドラー内で評価して、 のライブ ランタイム値に基づいて適切なコードを呼び出しますfoo。
  2. の値を変更する場合はfoo、 を使用.off()して以前のイベント ハンドラを削除し、新しいイベント ハンドラをインストールします。
  3. 変数を使用する代わりに、親オブジェクトのクラス名を変更し、使用するクラス名の値ごとに個別のイベント ハンドラーで委任されたイベント処理を使用できます。このように、jQuery の委任されたイベント処理ロジックとセレクターの比較を使用して、特定の時点でどのイベント ハンドラーを呼び出す必要があるかを決定します。

複数のイベント ハンドラーで使用する共通関数を作成することで、オプション 1 をより効率的またはより DRY にすることができます。しかし、イベント時に変数の値をチェックしたい場合は、イベント ハンドラーの時に実行されるコードであるため、イベント ハンドラー内でチェックする必要があるという事実は変わりません。

于 2013-02-13T17:02:39.883 に答える