-1

我正在做一个项目,我需要制作一个三消游戏,我需要用 jQuery 检查是否有 3 个或更多糖果彼此相邻但无法弄清楚。

有一列 7,这是用随机图像填充它的代码:

$(".element").attr('src', function() {
  var candy = Math.floor(Math.random() * 4 + 1);
  return "image/" + candy + ".png";
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="col-1">
  <img src="" class="element">
  <img src="" class="element">
  <img src="" class="element">
  <img src="" class="element">
  <img src="" class="element">
  <img src="" class="element">
  <img src="" class="element">
</div>

如你所见,我有 4 种不同的糖果。我需要的是让程序检查 3 个或更多糖果是否对齐并移除它们。

任何帮助或提示将不胜感激。

4

1 回答 1

0

这是一个尝试,看看

function draw(){
$(".element").each(function(){
 var candy = Math.floor(Math.random() * 4 + 1);
  var src=  "image/" + candy + ".png";
$(this).attr('src',src);
$(this).attr('candy',candy);
});
}
function validate(){

 var v= -1;
 var counter = [];
 $(".element").each(function(){
   var candy = $(this).attr("candy");
      if (counter.length<=3){
   if (v == candy)
    {
       counter.push(this);         
    }else {
    if (counter.length<=3){
       v = candy;
      counter =[];
      counter.push(this)
      }
   }
  }
 
 });
 
 
 console.clear();
console.log(counter.length + " elements next to eachother") 
if (counter.length>2)
    console.log(counter) // here you could remove then or whatever
    else console.log("fail, there is less then three element next to eachother, try agen")
draw()
}

draw()
<script  src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="col-1">
  <img src="" class="element">
  <img src="" class="element">
  <img src="" class="element">
  <img src="" class="element">
  <img src="" class="element">
  <img src="" class="element">
  <img src="" class="element">
</div>

<input type="button" onclick="validate()" value="validate" />

于 2019-02-18T15:07:09.193 回答