Question

我正在为课堂创建一个简单的平铺游戏。我想做的是：

在父母div中是一个儿童班＆＃39; square＆＃39;如果点击，广场将附加到父级，并且类为“空”＆＃39;
我需要有孩子的父母现在上课“空”＆＃39;和现在被占用的父母有完整的＆＃39;

我当前遇到的问题是，孩子们不断向班级追加班级“空”，并且班级没有转换。

我看了一眼：Get all elements without child node in jQuery

在这里：http://api.jquery.com/toggleclass/

这是我的代码笔：http://codepen.io/super996/pen/vyQyxN

// buttonClicked is also a fn dispatching an action-creator
// Difference being the middle-ware handles the entire async process
<button onClick={this.buttonClicked}>Click me</button>

// when page loads all parent divs are clickable to .empty class div
$('document').ready(function () {


 for (let i = 0; i < $('.parent').children().length; i += 1) {
$('.square').click(function () {
  $(this).appendTo('.empty');
  });
  }
});

$('parent:has(.full)').click(function (event) {
  $(event.target).toggleClass('.empty', true);
      });
      });

if ($('.square').click === true) {
  //parent of sqaure gets class empty and destination of square
  //parent gets class full
  }

}）;

Answer 1

所以我对你如何实现这个目标有点模糊，但是当你点击一个完整的图块并且添加{时，你看起来想要将类从.full切换到.empty。 {1}}类到空磁贴。为此，您可以尝试将事件委派给.full

的子项

尝试：

#board

这可以帮助您，而无需为您完成整个任务;）现在您需要做的就是找出从$(document).ready(function(){ var $board = $('#board'); //Cache the board $board.on('click', 'div.full', function(){ $board.find('div.empty').removeClass('empty').addClass('full'); $(this).addClass('empty').removeClass('full'); }); });和.addClass切换到.removeClass和.appendTo

的位置

Answer 2

这是我完整的javascript代码。

也许你可以尝试用这个

替换你的脚本

// when page loads all parent divs are clickable to .empty class div
$('document').ready(function () {
  $('.square').click(function () {
      var parent = $(this).parent('div');
      $(this).appendTo('.empty');
      $('.empty').addClass('full').removeClass('empty');
      parent.addClass('empty').removeClass('full');
    });
});

使用jquery切换类

2 个答案: