Question

我试图查看用户点击的两个图像是否相同。我有一些代码可以检索被点击的图像的来源：

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

我只需要一种方法来比较两个来源。我尝试将数据源存储在一个数组中，看看它们是否相同，但我无法让它工作：

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.");
}

我认为这会比较用户点击的前两个图像源，但我似乎在某处出现了问题。

Answer 1

在点击任何内容之前，您需要检查路径是否匹配。

相反，试试这个：

(function() {
    var lastclicked = "";
    $("img").click(function() {
        var path = $(this).attr("src");
        if( lastclicked == path) {
            alert("Match!");
        }
        else {
            if( lastclicked != "") alert("No match...");
        }
        lastclicked = path;
    });
})();

Answer 2

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.");
   }
}

Answer 3

单击图像后，单击处理程序会向数组添加内容。您的点击处理程序附加后立即进行比较。换句话说，在任何人有机会点击任何内容之前，你比较数组中的前两个位置。

这是您应该学习的一些最佳实践代码。它将帮助您了解页面的生命周期以及jQuery如何与其进行最佳交互。

$(document).ready(function(){
    var lastClicked = '';
    $(document).on('click', 'img', function(){
        var src = $(this).attr('src');
        if (src == lastClicked) {
            alert('matching');
        } else {
            lastClicked = src;
        }
    });
});

如何查看两个图像源是否相等？

3 个答案: