2

我正在做一个记忆配对游戏。我有一些代码可以检查用户单击的两个图像是否具有相同的来源，如果它们具有相同的来源，则将其删除。

(function compareClicked() {
    var lastclicked = "";
    $("img").click(function() {
        var path = $(this).attr("src");
        if( lastclicked == path) {
            $('img').hide(1000, function () {
            $(this).remove();
             });
        }
        else {
            if( lastclicked != "") alert("Not a match");
        }
        lastclicked = path;
    });
})();

但是，如您所见，当它们具有相同的来源时，它会删除页面上的所有图像 - 即使用户没有单击任何图像。如何更改它，使其仅删除用户单击的两个图像？

4

3 回答 3

6 
var lastclicked = "";
$("img").click(function() {
    var path = $(this).attr("src"); // or this.src
    if (lastclicked == path) {
        $(this).hide(1000, function() {
            // remove image with same src as lastClicked
            $('img[src="' + lastclicked + '"]').remove();
        });
    } else {
        if (lastclicked != "") alert("Not a match");
    }
    lastclicked = path;
});

演示

于 2012-06-20T14:49:56.507 回答
2

如果您多次（超过两次）获得相同的 Src，我真的建议tag您单击单击的图像以知道应该隐藏哪一个。如前所述，您可以为此目的使用attr或特殊。class

于 2012-06-20T14:58:21.500 回答
2

像这样的东西怎么样

var lastEl = null;

$(document).ready(function(){

$('img').each(function(index){
  $(this).attr('id','img-' + index);
});    

$('img').click(function(){
  if( lastEl ) {
    if( ($(this).attr('src') == lastEl.attr('src')) && ($(this).attr('id') != lastEl.attr('id')) ) {
      $(this).remove();
      lastEl.remove();
    }
    lastEl = null;
  } else {
    lastEl = $(this);
  }
});

});

还没有测试过，但它必须非常接近

编辑：根据下面的对话更新了代码。JS小提琴在这里http://jsfiddle.net/joevallender/pc3Qa/3/

再次编辑：JS小提琴链接现在应该是正确的

于 2012-06-20T15:18:56.927 回答