2

ユーザーがクリックした2つの画像が同じかどうかを確認しようとしています。クリックされた画像のソースを取得するコードがあります。

$('img').click(function() { var path = $(this).attr('src'); });

2つのソースを互いに比較する方法が必要です。ソースを配列に格納して、それらが等しいかどうかを確認しようとしましたが、それを機能させることができませんでした。

var bothPaths = [];

$('img').click(function() {
    var path = $(this).attr('src');
    bothPaths.push(path);
}); 

if (bothPaths[0] == bothPaths[1]) {
    alert("they match.");
} else {
    alert("they don't match.");
}

これは、ユーザーがクリックした最初の2つの画像ソースを比較すると思いますが、どこかで問題があるようです。

4

3 に答える 3

6

パスが一致するかどうかを確認しています...何かがクリックされる前に。

代わりに、これを試してください：

(function() {
    var lastclicked = "";
    $("img").click(function() {
        var path = $(this).attr("src");
        if( lastclicked == path) {
            alert("Match!");
        }
        else {
            if( lastclicked != "") alert("No match...");
        }
        lastclicked = path;
    });
})();
于 2012-06-18T19:26:18.973 に答える
1

ifステートメントがロード時にのみ解釈される場合は、次のことを試してください。

var bothPaths = [];

$('img').click(function() {
    var path = $(this).attr('src');
    bothPaths.push(path);
    compare()
}); 

function compare() {
   if (bothPaths[0] == bothPaths[1]) {
      alert("they match.");
   } else {
       alert("they don't match.");
   }
}
于 2012-06-18T19:28:26.463 に答える
0

クリックハンドラーは、画像がクリックされた後に配列に物事を追加します。クリックハンドラーがアタッチされた直後に比較が行われます。つまり、誰かが何かをクリックする前に、配列の最初の2つの場所を比較します。

学習する必要のあるベストプラクティスコードを次に示します。これは、ページのライフサイクルと、jQueryがページと最適に相互作用する方法を理解するのに役立ちます。

$(document).ready(function(){
    var lastClicked = '';
    $(document).on('click', 'img', function(){
        var src = $(this).attr('src');
        if (src == lastClicked) {
            alert('matching');
        } else {
            lastClicked = src;
        }
    });
});
于 2012-06-18T20:07:57.513 に答える