单击DIV上的所有ID时如何显示最后一个ID

How to show last ID when All ID on DIV click

本文关键字:ID 何显示 显示 最后一个 DIV 单击      更新时间:2023-09-26

我是javascript新手。我想做一个小游戏。但坚持这个逻辑。

请尝试查看下面的代码,,,我想用div ID"correct gameOne"替换div ID"error-gameOne"点击所有div ID后,错误1,错误2,错误3,错误4,

我已经尝试过了,但在点击一个ID"错误的1"或其他ID后,会显示div ID"正确的gameOne"。我不想这样。请在下面给我修改一下我的脚本。抱歉我英语不好。非常感谢:脸红:

$(function() {
  $('#wrong1, #wrong2, #wrong3, #wrong4').click(function() {
    $(this).animate({
      opacity: 0,
      top: 100,
    }, 500);
    var divs = ['#wrong1, #wrong2, #wrong3, #wrong4'];
    if ($(this).next(divs).length === 1)
      $('#wrong-gameOne').eq(0).hide();
    else
      $('#correct-gameOne').eq(0).show();
  });
});
<img id="correct-gameOne" class="rightAnswer" src="http://authentic-scandinavia.com/system/images/tours/photos/10/thumbnail.jpg" data-current-game="1" data-next-game="2" style="display:none;" />
<img id="wrong-gameOne" class="wrongAnswer" src="http://authentic-scandinavia.com/system/images/tours/photos/125/thumbnail.jpg" data-current-game="1" data-next-game="2" />
<div id="wrong1" class="no-bottom">
  <label>TEXT 1</label>
</div>
<div id="wrong2" class="no-bottom">
  <label>TEXT 2</label>
</div>
<div id="wrong3" class="no-bottom">
  <label>TEXT 3</label>
</div>
<div id="wrong4" class="no-bottom">
  <label>TEXT 4</label>
</div>

请尝试此代码。

 $(function () {
    var divs = ["wrong1", "wrong2", "wrong3", "wrong4"];
    $('#wrong1, #wrong2, #wrong3, #wrong4').click(function () {
        $(this).animate({
            opacity: 0,
           top: 100,
         }, 500);
    divs.splice(divs.indexOf($(this).prop("id")),1)
    if(divs.length == 0){
        $('#wrong-gameOne').eq(0).hide();
       $('#correct-gameOne').eq(0).show();
    }                
  });
});

希望这对你有帮助。

Fiddle