Javascript 如何在单击时向其添加新值

大家好,

我刚刚开始学习一点编程，我被困在一个小测试项目上

我想这样做，当我点击一个棋子时，我可以把它添加到棋盘的一块瓷砖中

第一件很好，我也可以毫不费力地移动它

但当我想添加更多的块时，它会将它们全部添加到板的1个瓷砖中

此变量添加我单击的每个img，而不仅仅保存我单击的最后一个img：

var pawnToAdd = this;

这是一段代码，我做错了什么

$(document).ready(function(){
  $('img').on('click', function(){
    var pawnToAdd = this;
    console.log(pawnToAdd);

  $('.tile').on('click', function(){
    console.log(this);
    this.append(pawnToAdd);
   });
  });     
});

$document.readyfunction{ var pawnToAdd=null； $'img'。单击，函数{ //将棋子设定为添加 pawnToAdd=这个； }; $'.tile'。单击，函数{ //如果尚未单击任何典当，则不执行任何操作 如果pawnToAdd！=null{ 这是我的补充； //清除典当引用，以便用户必须单击另一个典当引用 pawnToAdd=null； } };

---

};请将相关的HTML和CSS添加到您的问题中，以便我们可以复制您的问题并为您提供有效的答案。每次单击img，都会在所有互动程序上创建一个新的单击事件处理程序。不要这样做。更清楚一点，你的.tile click事件代码嵌套在你的img click处理程序中。移动.tile click代码，使其位于img click代码之后。您了解这些更改吗？是的，我知道，只是不知道正确的语法。我在尝试像pawnToAdd=；还有一个removeData。但这起作用了：再次感谢。我还有一个问题。在换钱之前，我可以把棋子从一块瓦片移到另一块瓦片。现在我只能把它们加入董事会。但一旦它们被添加到瓷砖中，我就无法移动它们。我应该为这个做一个新的功能，还是我可以编辑这个，这样我也可以在电路板上移动这些部件？因为我不明白为什么不可能了如果你想让它们在一个瓷砖之间移动，请注释掉pawnToAdd=null；点击处理程序中的一部分。这起作用了，你能解释一下为什么吗？现在我也没有完全得到以前的改变。。。