1

次のようなJSで単語検索ゲームを開発しようとしています: https://jquery-wordsearch-game.googlecode.com/svn/trunk/demo.html

ところで、私はその人のプラグインを使用しておらず、代わりに自分で開発しようとしています。

次のコードを使用してハンドラーを起動し、ユーザーがセルをクリックして移動したときにセルを強調表示しています。

$('#puzzlecontainer').on('mousedown','.block',myHandler);

問題は、mousedown イベントが最初のセルでのみ発生することです。ハンドラーがマウスのパス内のすべてのセルで起動するようにします。

また、これをタッチイベントと互換性を持たせるにはどうすればよいですか? タッチムーブとタッチダウンをやってみました。

助けてください

アップデート

Shusl の助けを借りて、次のコードを追加しました。

        $('#puzzlecontainer').on('vmousedown','.block', function(){
            globalvars.ismousedown =true;
            $(this).addClass("active");
        });

        $('#puzzlecontainer').on('vmouseover','.block', function(){ 
            if(globalvars.ismousedown){
                $(this).addClass("active");
            }
        });

        $('#puzzlecontainer').on('vmouseup','.block', function(){ 
            globalvars.ismousedown = false;
        });

vmouseoverは、デスクトップ ブラウザで必要に応じて動作します。しかし、私の Android スマートフォンとタブレットでは機能しません。助けてください。

4

2 に答える 2

0

mouseenter で発生するイベントを追加および削除する関数を起動します。マウスがダウンしているときにこのイベントを追加し、マウスが上にあるときに削除して、強調表示を停止します...

$('#puzzlecontainer').on('mousedown','.block',startSelect);// Run when down
$('#puzzlecontainer').on('mouseup','.block',stopSelect);// Run when up

function startSelect(){
    $('#puzzlecontainer').on('mouseenter','.block',myHandler);//Add Handler on enter.
    // Fire the mouseenter event for the current element or it will not highlight.
    $(this).trigger('mouseenter');
}
function stopSelect(){
    $('#puzzlecontainer').off('mouseenter','.block',myHandler);//Remove Handler because mouseup.
}
于 2012-10-09T09:49:19.640 に答える
0

mouseover各セルでイベントを使用し、フラグを true に設定できますmyHandler。mousedowntrue かどうかを確認してから、イベントとして扱います

var ismosedown = false;

    $('#puzzlecontainer').on('mousedown','.block', function(){ ismosedown =true; } );
   $('allcells').mouseover(function(){
          if(ismosedown ){ // do works
           }
    }).mouseup(function(){
           ismosedown = false;
     });
于 2012-10-09T09:50:05.140 に答える