尝试根据分配的 jQuery 索引号将类添加到 div



我使用以下方法将一系列div附加到我的$board父级:

var $board = $('<div id="board"></div>');
var $row = $('<div class="row"></div>');
var $cell = $('<div class="box stdBG"></div>')
var $aRow;
var $aCell;
for (var i=0; i < 17; i++){
$aRow = $row.clone();
$board.append($aRow);
for (var j =0; j <25; j++){
$aCell = $cell.clone();
$aRow.append($aCell); 
if (i===8 && j==12){
$aCell.removeClass('stdBG').addClass('marvin');
indexI = i;
indexJ = j;
}
}
} 

这工作正常,但随后我尝试使用以下方法将"marvin"类添加到相邻的div 中:

indexJ += 1;
$('.row').eq(indexI).find('.cell').eq(indexJ).addClass('marvin');

它不做任何事情,我没有收到任何错误消息。这个菜鸟需要帮助!

你的主要问题是你正在寻找.cell不存在的类。一定是.box.

$('.row'(.eq(indexI(.find('.

cell'(.eq(indexJ(.addClass('marvin'(;

我已经制作了这个片段,它工作正常:

var indexI = 0,
indexJ = 0;
var $board = $('#board');
var $row = $('<div class="row"></div>');
var $cell = $('<div class="box stdBG"></div>');
for (var i = 0; i < 17; i++) {
var $aRow = $row.clone();
$board.append($aRow);
for (var j = 0; j < 25; j++) {
var $aCell = $cell.clone();
$aRow.append($aCell);
if (i === 8 && j === 12) {
$aCell.removeClass('stdBG').addClass('marvin');
indexI = i;
indexJ = j;
}
}
}
indexJ += 1;
$('.row').eq(indexI).find('.box').eq(indexJ).addClass('marvin');
div {
line-height: 0
}
.box {
width: 10px;
height: 10px;
display: inline-block;
border: solid 1px #fff
}
.stdBG {
background: grey
}
.marvin {
background: pink
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="board"></div>

你的问题在这里:

.find('.cell')

必须是 .box 代替

$('.row').eq(indexI).find('.box').eq(indexJ).addClass('marvin');

下次如果发生同样的事情(浏览器控制台上没有错误(,我建议您使用浏览器开发人员工具中的手表来检查是否有任何选择器返回错误的项目

最新更新