JavaScript array.sort() 问题

Question

起草了一个快速列表工具来列出本地的 child 棒球队。接受几个输入并写入文本字段。也有一些验证和诸如此类的东西，但这超出了范围并且似乎没有影响事情。

问题是，在将新结果写入段落元素(有效地替换它)之前，我无法弄清楚如何“捕获”现有文本、添加新输入并对所有文本进行排序。

到目前为止我有:

var LeagueTeams = [];
var IndividualTeam = '';

LeagueTeams.push(document.forms[0].TeamName.value);
LeagueTeams.push(document.getElementById('TeamList')

LeagueTeams = LeagueTeams.sort();

for (j = 0; j < LeagueTeams.length; j++) {
    IndividualTeam = LeagueTeams.pop();
    IndividualTeam = IndividualTeam + '' + \n;
    document.forms[0].TeamName.value += IndividualTeam;
}

我最终得到的是我的输入，然后是我的输入数组加上之前的内容，还有几个换行符。将运算符设置为 = 而不是 =+ 会完全阻止它打印到数组。

即

输入:a文本区域:a然后输入:b文本区域:a ab

(等)

Answer 1

好的，现在我们对您要尝试做的事情有了更好的了解，这里有一些代码可以做到这一点:

HTML:

<label>Enter Team Name: <input id="newTeam" type="text"></label> 
<button id="add">Add</button><br>
All Teams:<br>
<textarea id="allTeams" rows="40" cols="40"></textarea>

Javascript(纯 javascript，无框架，在页面加载后调用):

var teamList = ["Dodgers", "Mets", "Giants"];

document.getElementById("add").onclick = function() {
    var input = document.getElementById("newTeam");
    if (input.value) {
        teamList.push(input.value);
    }
    updateTeamList();
    input.value = "";
}

function updateTeamList() {
    teamList.sort();
    var o = document.getElementById("allTeams");
    o.value = teamList.join("\n");
}

updateTeamList();

而且，你可以看到它在这里工作:http://jsfiddle.net/jfriend00/HkhsL/

---

对现有代码的评论:

我不确定我是否理解您总体上想要做什么，但是您是否意识到这个循环会出现问题:

for (j = 0; j < LeagueTeams.length; j++) {
    IndividualTeam = LeagueTeams.pop();
    IndividualTeam = IndividualTeam + '' + \n;
    document.forms[0].TeamName.value += IndividualTeam;
}

每次您执行 LeagueTeams.pop() 时，您都在减少数组的长度，并且您不断地与 for 循环中的 LeagueTeams.length 进行比较。这只会通过数组的一半，因为每次通过循环，您递增 j 并减少 LeagueTeams.length 这意味着您只会通过数组的一半.

如果您打算在 for 循环中一直遍历数组，您应该使用这个最初获取长度并简化循环中代码的版本:

for (j = 0, len = LeagueTeams.length; j < len; j++) {
    document.forms[0].TeamName.value += LeagueTeams.pop() + '\n';
}

或者甚至更好，这个版本甚至不使用 j:

while (LeagueTeams.length > 0) {
    document.forms[0].TeamName.value += LeagueTeams.pop() + '\n';
}

此外，我发现您正在尝试对一个既包含字符串又包含 DOM 对象引用的数组使用 LeagueTeams.sort()。你想用那种排序做什么，因为内置的排序函数执行词法排序(例如 alpha)，这将对 DOM 引用做一些奇怪的事情(可能按 toString() 返回的任何内容排序可能是对象类型)？

如果你想按团队名称对输入进行排序，那么你需要将团队名称和 DOM 引用放入一个对象中，将该对象作为一个单元插入到数组中，然后使用自定义排序函数进行排序通过对象中的名称。正如上面所写的代码，您看到使用的是 document.getElementById('TeamList') 这对所有团队都是相同的，所以我不确定为什么要将它放入数组中全部。

如果您可以展示您的 HTML 和更完整的代码版本，我们可以提供进一步的帮助。您上面的只是一段无法工作的代码，我们不知道您的 HTML 是什么样子的，它正在尝试对其进行操作。

仅供引用，您发布的代码中有几个语法错误，因此这不能运行代码:

1. 结尾缺少括号:LeagueTeams.push(document.getElementById('TeamList'))
2. \n 周围缺少引号:IndividualTeam = IndividualTeam + '' + '\n';