我正在尝试对包含标题和日期的字符串列表进行排序。 第一个jQuery按第一个字符的字母顺序对列表进行排序（来自W3学校） 但是，第二个jQuery应该按包含日期的字符串的后半部分进行排序。 通过在字符串中查找“-”，我对第一个jQuery做了一些改动。 它确实对列表进行了排序，但是问题在于它通过将结果与标题（城市名称）分组来对日期进行排序。因此，存在针对每个重复的城市名称实例进行排序的日期，而不是针对随机城市名称的真实排序。
看起来好像是通过按首字母（原始jquery）对列表进行排序来对日期进行排序。
jsfiddle： https://jsfiddle.net/aprilius/638jbq7o/3/
整个页面：
<!DOCTYPE html>
<html lang="en-US">
<head>
<title>Table</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<script type="text/javascript" src="https://code.jquery.com/jquery-1.9.1.js"></script>
<script type="text/javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
<style>
.center {
margin: auto;
width: 70%;
border: 3px solid #73AD21;
padding: 10px;
-webkit-column-width: 240px;
-moz-column-width: 240px;
column-width: 240px;
column-gap:20px;
-moz-column-gap:20px;
-webkit-column-gap:20px;
column-count:2;
-moz-column-count:2;
-webkit-column-count:2;}
</style>
</head>
<body>
<div class="center">
<button onclick="sortListAZ()">Sort by Title</button>
<button onclick="sortListDate()">Sort by Date</button>
<input type="text" id="filterbar" onkeyup="myFunction()" placeholder="Search for names.." title="Type in a name">
<script>
function sortListAZ() {
var list, i, switching, b, shouldSwitch, dir, switchcount = 0;
list = document.getElementById("example");
switching = true;
// Set the sorting direction to ascending:
dir = "asc";
// Make a loop that will continue until no switching has been done:
while (switching) {
// start by saying: no switching is done:
switching = false;
b = list.getElementsByTagName("LI");
// Loop through all list-items:
for (i = 0; i < (b.length - 1); i++) {
//start by saying there should be no switching:
shouldSwitch = false;
/* check if the next item should switch place with the current item, based on the sorting direction (asc or desc): */
if (dir == "asc") {
if (b[i].innerHTML.toLowerCase() > b[i + 1].innerHTML.toLowerCase()) {
/* if next item is alphabetically lower than current item, mark as a switch and break the loop: */
shouldSwitch = true;
break;}}
else if (dir == "desc") {
if (b[i].innerHTML.toLowerCase() < b[i + 1].innerHTML.toLowerCase()) {
/* if next item is alphabetically higher than current item, mark as a switch and break the loop: */
shouldSwitch= true;
break;}}}
if (shouldSwitch) {
/* If a switch has been marked, make the switch and mark that a switch has been done: */
b[i].parentNode.insertBefore(b[i + 1], b[i]);
switching = true;
// Each time a switch is done, increase switchcount by 1:
switchcount ++;}
else {
/* If no switching has been done AND the direction is "asc", set the direction to "desc" and run the while loop again. */
if (switchcount == 0 && dir == "asc") {
dir = "desc";
switching = true;}}}}
</script>
<script>
function sortListDate() {
var list, i, switching, b, c, shouldSwitch, dir, switchcount = 0;
list = document.getElementById("cuprins");
switching = true;
// Set the sorting direction to ascending:
dir = "asc";
// Make a loop that will continue until no switching has been done:
while (switching) {
// start by saying: no switching is done:
switching = false;
b = list.getElementsByTagName("LI");
//substr(list.getElementsByTagName("LI").length - 8);
// Loop through all list-items:
for (i = 0; i < (b.length - 1); i++) {
//start by saying there should be no switching:
shouldSwitch = false;
/* check if the next item should switch place with the current item, based on the sorting direction (asc or desc): */
if (dir == "asc") {
if (b[i].innerHTML.toLowerCase().slice(b[i].innerHTML.indexOf('- ')) > b[i + 1].innerHTML.toLowerCase().slice(b[i+1].innerHTML.indexOf('- '))) {
/* checking the string for Date after "- " */
/* if next item is alphabetically lower than current item, mark as a switch and break the loop: */
shouldSwitch = true;
break;}}
else if (dir == "desc") {
if (b[i].innerHTML.toLowerCase().slice(b[i].innerHTML.indexOf('- ')) < b[i + 1].innerHTML.toLowerCase().slice(b[i+1].innerHTML.indexOf('- '))) {
/* if next item is alphabetically higher than current item, mark as a switch and break the loop: */
shouldSwitch= true;
break;}}}
if (shouldSwitch) {
/* If a switch has been marked, make the switch and mark that a switch has been done: */
b[i].parentNode.insertBefore(b[i + 1], b[i]);
switching = true;
// Each time a switch is done, increase switchcount by 1:
switchcount ++;}
else {
/* If no switching has been done AND the direction is "asc", set the direction to "desc" and run the while loop again. */
if (switchcount == 0 && dir == "asc") {
dir = "desc";
switching = true;}}}}
</script>
<script>
function myFunction() {
var input, filter, ul, li, a, i, txtValue;
input = document.getElementById("filterbar");
filter = input.value.toUpperCase();
ul = document.getElementById("example");
li = ul.getElementsByTagName("LI");
for (i = 0; i < li.length; i++) {
a = li[i].getElementsByTagName("a")[0];
txtValue = a.textContent || a.innerText;
if (txtValue.toUpperCase().indexOf(filter) > -1) {
li[i].style.display = "";
} else {
li[i].style.display = "none";}}}
</script>
<ul id="example">
<li><a href="#">Edinburgh - 2011/04/25</a></li>
<li><a href="#">Tokyo - 2011/07/25</a></li>
<li><a href="#">San Francisco - 2009/01/12</a></li>
<li><a href="#">Edinburgh - 2012/03/29</a></li>
<li><a href="#">Tokyo - 2008/11/28</a></li>
<li><a href="#">New York - 2012/12/02</a></li>
<li><a href="#">San Francisco - 2012/08/06</a></li>
<li><a href="#">Tokyo - 2010/10/14</a></li>
<li><a href="#">San Francisco - 2009/09/15</a></li>
<li><a href="#">Edinburgh - 2008/12/13</a></li>
<li><a href="#">London - 2008/12/19</a></li>
<li><a href="#">Edinburgh - 2013/03/03</a></li>
<li><a href="#">San Francisco - 2008/10/16</a></li>
<li><a href="#">London - 2012/12/18</a></li>
<li><a href="#">London - 2010/03/17</a></li>
<li><a href="#">London - 2012/11/27</a></li>
<li><a href="#">New York - 2010/06/09</a></li>
<li><a href="#">New York - 2009/04/10</a></li>
<li><a href="#">London - 2012/10/13</a></li>
<li><a href="#">Edinburgh - 2012/03/26</a></li>
<li><a href="#">New York - 2011/09/03</a></li>
<li><a href="#">New York - 2009/06/25</a></li>
<li><a href="#">New York - 2011/12/12</a></li>
<li><a href="#">Sydney - 2010/09/20</a></li>
<li><a href="#">London - 2009/10/09</a></li>
<li><a href="#">Edinburgh - 2010/12/22</a></li>
<li><a href="#">Singapore - 2010/11/14</a></li>
<li><a href="#">San Francisco - 2011/06/07</a></li>
<li><a href="#">San Francisco - 2010/03/11</a></li>
</ul>
</div>
</body>
</html>
已解决：完整的jQuery（由@Cristian Sarghe修复），用于按标题和日期按Title - YYYY/MM/DD对条目（字符串）列表进行排序，升序和降序如下：
function sortListDate() {
var list, i, switching, b, c, shouldSwitch, dir, switchcount = 0;
list = document.getElementById("cuprins");
switching = true;
// Set the sorting direction to ascending:
dir = "asc";
// Make a loop that will continue until no switching has been done:
while (switching) {
// start by saying: no switching is done:
switching = false;
b = list.getElementsByTagName("LI");
//substr(list.getElementsByTagName("LI").length - 8);
// Loop through all list-items:
for (i = 0; i < (b.length - 1); i++) {
//start by saying there should be no switching:
shouldSwitch = false;
/* check if the next item should switch place with the current item, based on the sorting direction (asc or desc): */
if (dir == "asc") {
if (b[i].innerHTML.toLowerCase().slice(b[i].innerHTML.indexOf('- ')) > b[i + 1].innerHTML.toLowerCase().slice(b[i+1].innerHTML.indexOf('- '))) {
/* checking the string for Date after "- " */
/* if next item is alphabetically lower than current item, mark as a switch and break the loop: */
shouldSwitch = true;
break;}}
else if (dir == "desc") {
if (b[i].innerHTML.toLowerCase().slice(b[i].innerHTML.indexOf('- ')) < b[i + 1].innerHTML.toLowerCase().slice(b[i+1].innerHTML.indexOf('- '))) {
/* if next item is alphabetically higher than current item, mark as a switch and break the loop: */
shouldSwitch= true;
break;}}}
if (shouldSwitch) {
/* If a switch has been marked, make the switch and mark that a switch has been done: */
b[i].parentNode.insertBefore(b[i + 1], b[i]);
switching = true;
// Each time a switch is done, increase switchcount by 1:
switchcount ++;}
else {
/* If no switching has been done AND the direction is "asc", set the direction to "desc" and run the while loop again. */
if (switchcount == 0 && dir == "asc") {
dir = "desc";
switching = true;}}}}
答案 0 :(得分：0)
那是一个类似分号的类型问题。
您正在slice('- ')原型上使用string函数。
您应该为其传递索引，而不是字符串。
从技术上讲，只需在必要时使用b[i].innerHTML.indexOf('- ')和b[i]来使用b[i+1]，而不是字符串作为slice(...)的参数。
JSFiddle：https://jsfiddle.net/w6L41v3p/