0

ユーザーがクリックしたもの（最初、最後）を追跡する配列（サイズ2にスプライス）があります。最初と最後の要素は一意です。

ユーザーがクリックした内容に基づいてコンテンツを読み込もうとしています。奇妙なことに、2つのconsole.logを実行しない限り、更新された配列が表示されません。1つのログが実行されると、アレイは更新されません。これは、アレイの実行/操作時間と関係があると思います。

私がデバッグする方法は、クリックハンドラーを使用してドキュメントを作成し、クリックして配列の値を確認することです。何か提案やヒントはありますか？

私はこれまでこの問題を抱えたことはありませんでした。ありがとう。

    var clicksInfo = [];

    $('#a, #b, #c').on('click', function(e){

    // array: add, splice
    if(jQuery.inArray($(this).attr('id'), clicksInfo) == -1){
        clicksInfo.push($(this).attr('id'));
        if(clicksInfo.length == 2){
          //  might do something
        }else if(clicksInfo.length == 3){
          clicksInfo.splice(0,1);
        }
      }else{
        clicksInfo.splice(0,1);
        clicksInfo.push($(this).attr('id'));      
      }

      if($(this).attr('id') == 'a'){
        //  do stuff.
      }else if($(this).attr('id') == 'b'){  
        //  do stuff.
      }else if($(this).attr('id') == 'c'){
        //  do stuff.
      }
    });


    $(document).on('click', function(){
      console.log('clicksInfo', clicksInfo);
      // console.log('clicksInfo', clicksInfo);
    });
4

2 に答える 2

2

console.log内であっても、文字列は文字列であり、配列は配列であるため、次のようにします。

console.log('clicksInfo', clicksInfo);

それは文字列、コンマ、そして配列ですか？

やってみてください：

console.log('clicksInfo : '+ clicksInfo);

文字列表現を表示する場合、または配列をオブジェクトとして表示する場合は、他の奇妙なものと混同しないでください。

console.log(clicksInfo);
于 2012-10-15T18:56:06.700 に答える
0

あなたが直面している問題は、発生するイベントが特定の順序で実行されることが保証されていないことです。どちらのクリックハンドラーも最初に実行できますが、ほとんどのブラウザーでは、＃a、＃b、＃cのハンドラーが最初に実行されます。

setTimeoutを使用してデータを同期するのに十分な時間待機することもできますが、コードが破損する可能性が非常に高くなります。

どちらの場合もクリックを処理する場合は、＃a、＃b、および#cのハンドラーを削除することをお勧めします。ドキュメントクリックハンドラーのみを使用し、イベント宣言を渡してから、ハンドラーでクリックされた要素のIDを確認して、最初のコードを呼び出します。その後、コードの2番目のブロックが実行される前に、データが更新されていることが保証されます。このようなもの：

var clicksInfo = [];

$(document).on('click', function(e){

    if (e.target.id === "a" || e.target.id === "b" || e.target.id === "c") {
        // array: add, splice
        if (jQuery.inArray(e.target.id, clicksInfo) == -1){
            clicksInfo.push(e.target.id);
            if(clicksInfo.length == 2){
                 //  might do something
            } else if(clicksInfo.length == 3){
                clicksInfo.splice(0,1);
            }
        } else {
             clicksInfo.splice(0,1);
             clicksInfo.push(e.target.id);
        }

      if(e.target.id === 'a'){
        //  do stuff.
      }else if(e.target.id === 'b'){  
        //  do stuff.
      }else if(e.target.id === 'c'){
        //  do stuff.
      }
    }

    console.log('clicksInfo', clicksInfo);
});

JSFiddleはこちら。

于 2012-10-15T19:11:57.727 に答える