为bracket.js编写插入函数时二维数组null赋值异常求助

我仔细看了你的代码和预期输出，确实是while循环逻辑和一个语法错误导致了问题。我们一步步拆解分析：

核心问题1：While循环的逻辑错误 #

你的循环条件是：

while(data.teams[i][0] != null || data.teams[i][1] != null) { i++; }

这里用了||（逻辑或），意思是只要当前子数组的任意一个位置不为null，就直接跳到下一个子数组。第一次调用后，data.teams[0][0]已经变成"team 1"，所以第二次调用时，循环会直接跳过这个子数组，跳到i=1的位置——这就是为什么第二次的值被放到了[1][0]而不是[0][1]。

你真正需要的是找到第一个还有空位（至少一个位置是null）的子数组，所以应该把条件改成&&（逻辑与），同时加上数组边界判断避免越界：

while(i < data.teams.length && data.teams[i][0] != null && data.teams[i][1] != null) { i++; }

这个条件的意思是：只有当前子数组的两个位置都不为null，且还没遍历完所有子数组时，才继续往下跳。这样就能精准停在第一个有空位的子数组上。

核心问题2：赋值用了比较运算符 #

在else if分支里，你写了：

data.teams[i][1] == text[1];

这里的==是比较运算符，不是赋值运算符=，所以即使进入这个分支，也不会给data.teams[i][1]赋值，这会导致第一个子数组的第二个位置永远是null。

需要改成赋值语句：

data.teams[i][1] = text[1];

额外优化：移除无用代码 #

你代码里有一个空的if判断：

if( i == data.teams.length - 1){}

这个完全没有实际作用，可以直接删掉，避免代码冗余。

修正后的完整代码 #

function add(team, data) {
  var str = team.innerHTML;
  var str = str.replace(/<td>/g, "");
  var text = str.split("</td>");
  var i = 0;
  
  // 找到第一个还有空位的子数组
  while(i < data.teams.length && data.teams[i][0] != null && data.teams[i][1] != null) {
    i++;
  }
  
  // 优先填充当前子数组的第一个空位，再填第二个
  if(data.teams[i][0] == null) {
    data.teams[i][0] = text[1];
  } else if(data.teams[i][1] == null) {
    data.teams[i][1] = text[1];
  }
  
  $(function() {
    var container = $('.creator')
    container.bracket({ 
      init: data, 
      save: saveFn, 
      userData: ""
    }) 
  }) 
}

验证效果 #

• 首次调用后：{"teams":[["team 1",null],[null,null]]}（符合预期）
• 第二次调用后：{"teams":[["team 1","team 2"],[null,null]]}（现在会填充第一个子数组的第二个位置，满足你的需求）

内容的提问来源于stack exchange，提问作者Maximilien Nowak