コードを変更して、フラグと setTimeout を使用して目的を達成できます。
このようなタイトなループ (ビジー ループ) は、ブラウザーからの入力をブロックするため、基本的にイベント キューを解析できません。ブラウザがロックされます。
ループを実行するために setTimout を実装することにより、ブラウザーが他のイベントをキューに入れることができるようになります。これは、いつ停止するかを検出する必要があります。
毎回引数を指定してループを呼び出すと、実際にはループを複数回再トリガーするだけです。false フラグで呼び出すと、フラグはその呼び出しに対してローカルになり、開始された他のループはこのローカライズされたフラグにアクセスできないため、何もしません。
したがって、1 つのアプローチは、フラグを外側 (共通フラグ、グローバル スコープ) に置くことです。
ここで修正されたフィドル
例:
var doLoop = false;
function loopy() {
if (doLoop === true) {
setTimeout(function () {
console.log(doLoop);
loopy();
}, 11);
}
};
$(document).on("mousedown", ".classy", function () {
doLoop = true;
loopy();
});
$(document).on("mouseup mouseout", ".classy", function () {
doLoop = false;
});
マウスを押している間はループが実行され、離すとループが停止することがわかります。