2

私はメモリマッチングゲームに取り組んでいます。ユーザーがクリックした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;
    });
})();

ただし、ご覧のとおり、ソースが同じである場合、ユーザーが画像をクリックしていなくても、ページ上のすべての画像が削除されます。ユーザーがクリックした2つの画像のみが削除されるように変更するにはどうすればよいですか?

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を複数回(2回以上)取得した場合は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 に答える