My.sort(）只对输入框中的添加值进行排序?为什么会这样

My .sort() is only sorting the added values from my input box? why is this

本文关键字：排序 为什么 添加 sort 输入 My      更新时间：2023-09-26

所以我创建了一个输入框来向数组添加值，但当它对数组进行排序时，它只对输入框中的值进行排序，而不是对整个数组进行排序。我把它弄得一团糟，但似乎什么都不起作用。

<script>
var Arrays = ["Printer", "Tablet", "Router", "Smart phone", "Motherboard",     "Hard drive"];
document.getElementById("beef").innerHTML = Arrays;

function displayMessage() {
var userInput = document.hey.firstname.value; 
document.getElementById("pie").innerHTML = "The user entered: " + userInput +  "<br>";
Arrays.push(userInput);
document.getElementById("pie").innerHTML = Arrays;
} 
function count() {
document.getElementById("counting").innerHTML =
Arrays.length;
}
function sort() { 
document.getElementById("pie").innerHTML = Arrays;
Arrays.sort();
}   


</script>
<body>

JavaScript数组

<br>
<form name="hey">
Enter value:
<br>
<input type="" name="firstname" value="">
<br>
<button type="button" onclick="displayMessage()">Add to list</button>
</form>
<p id="pie"></p>
<br>
<p id="beef"></p>
<br>
<button type="button" onclick="count();sort();">Click to count and sort</button>
<br>
<p id="counting"></p>
<br>
<p id="sorting"></p>
<br>
</body>
</html>

我真的不知道有没有排序，但是，我注意到了一个问题，并在下面列出了它。

您需要更新sort函数，以便首先排序，然后在html中设置值。

function sort() { 
   Arrays.sort(); // need to sort first
   document.getElementById("pie").innerHTML = Arrays;
}

这里有多个问题。首先，正如其他评论所说，你需要在写结果之前进行排序。第二件事是，您可能输入了小写字母作为用户输入，但javascript数组排序区分大小写，以大写字母开头的单词在以小写字母开头的词之前排序。如果您愿意忽略大小写，则需要向排序函数添加自定义功能。您可以尝试将您的排序功能替换为：

function sort() {
    Arrays.sort(function(a, b) {
        if (a.toLowerCase() < b.toLowerCase())
            return -1;
        if (a.toLowerCase() > b.toLowerCase())
            return 1;
        return 0;
    });
    document.getElementById('beef').innerHTML = Arrays;
}

在旁注中，您正在重写displayMessage方法中的The user entered..句子。您可能想将pie更改为beef。同样的东西也可以应用于排序方法内部。最后，代码应该是这样的：

var Arrays = ['Printer', 'Tablet', 'Router', 'Smart phone', 'Motherboard', 'Hard drive'];
document.getElementById("beef").innerHTML = Arrays;
function displayMessage() {
    var userInput = document.hey.firstname.value;
    document.getElementById('pie').innerHTML = "The user entered: " + userInput +  "<br>";
    Arrays.push(userInput);
    document.getElementById('beef').innerHTML = Arrays;
} 
function count() {
    document.getElementById('counting').innerHTML = Arrays.length;
}
function sort() {
    Arrays.sort(function(a, b) {
        if (a.toLowerCase() < b.toLowerCase())
            return -1;
        if (a.toLowerCase() > b.toLowerCase())
            return 1;
        return 0;
    });
    document.getElementById('beef').innerHTML = Arrays;
}
<br>
  <form name="hey">
    Enter value:<br>
    <input type="" name="firstname" value=""><br>
    <button type="button" onclick="displayMessage();">Add to list</button>
  </form>
  <p id="pie"></p>
<br>
  <p id="beef"></p>
<br>
  <button type="button" onclick="count();sort();">Click to count and sort</button>
<br>
  <p id="counting"></p>
<br>
  <p id="sorting"></p>
<br>

相关文章：