Javascript-форум - Сортировка. Некоректная работа с числами

Javascript-форум (https://javascript.ru/forum/)

- Events/DOM/Window (https://javascript.ru/forum/events/)

- - Сортировка. Некоректная работа с числами (https://javascript.ru/forum/events/23249-sortirovka-nekorektnaya-rabota-s-chislami.html)

Сортировка. Некоректная работа с числами

Привет всем! Скрипт сортирует по значению одного из <li>.
Все ок если значения однозначны - т.е. 4,1,5,8, но когда например 4,10,5,8 – скрипт работает не корректно.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang='ru-RU'>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<script type="text/javascript">
var $A = function(iterable) {
if (iterable) {
var result = [], i = iterable.length;
while (i) result[--i] = iterable[i];
return result;
}
return [];
};
function parse(sortWhat,width,what) {
var ul = document.getElementById(sortWhat).getElementsByTag Name('ul')[0],
arr = $A(ul.getElementsByTagName('li'));
var size = arr.length/width;
var newArr = new Array (size);
for (var i = 0; i<size; i++) {
newArr[i] = new Array(width);
}
for (var i = 0; i<size; i++) {
for (var j = 0; j<width; j++) {
newArr[i][j] = arr[i*width+j];
}
}
newArr.sort(function(i, ii) {
i = i[what].innerHTML.toLowerCase();
ii = ii[what].innerHTML.toLowerCase();
if (i > ii)
return 1;
else if (i < ii)
return -1;
else
return 0;
});
for (var i = 0; i<size; i++) {
for (var j = 0; j<width; j++) {
ul.appendChild(newArr[i][j]);
}
}
return false;
}
</script>
</head>
<body>
<input type="button" value="Сортировать(возрастани е)" onclick="parse('sort',4,0);" />
<input type="button" value="Сортировать(возрастани е)" onclick="parse('sort',4,1);" />
<input type="button" value="Сортировать(возрастани е)" onclick="parse('sort',4,2);" />
<input type="button" value="Сортировать(возрастани е)" onclick="parse('sort',4,3);" />
<div id="sort">
<ul>
<li>Л</li>
<li>34</li>
<li>200 </li>
<li>1111f</li>
<li>К</li>
<li>10</li>
<li>10 </li>
<li>3333f</li>
<li>П</li>
<li>23</li>
<li>300 </li>
<li>2222f</li>
</ul>
</div>
</body>
</html>

formus,
Потому что вы сортируите строки а не числа!!!

Пожалуйста, отформатируйте свой код!

Для этого его можно заключить в специальные теги: js/css/html и т.п., например:

[js]
... ваш код...
[/js]

О том, как вставить в сообщение исполняемый javascript и html-код, а также о дополнительных возможностях форматирования - читайте http://javascript.ru/formatting.

Почитать не?

arr= [40, 2, 25, 15, 1, 20];
alert(arr.sort(function(a, b){return a-b}));

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang='ru-RU'>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

var $A = function(iterable) {
		if (iterable) {
			var result = [], i = iterable.length;
			while (i) result[--i] = iterable[i];
			return result;
		}
		return [];
	};
	function parse(sortWhat,width,what) {
		var ul = document.getElementById(sortWhat).getElementsByTagName('ul')[0],
		arr = $A(ul.getElementsByTagName('li'));	
		var size = arr.length/width;	
		var newArr = new Array (size); 
		for (var i = 0; i<size; i++) {
			newArr[i] = new Array(width);
			}
		for (var i = 0; i<size; i++) {
			for (var j = 0; j<width; j++) {
				newArr[i][j] = arr[i*width+j];
				}				
			}

		newArr.sort(function(i, ii) {
			i = i[what].innerHTML.toLowerCase();
			ii = ii[what].innerHTML.toLowerCase();
			if (i > ii)
				return 1;
			else if (i < ii)
				return -1;
			else
				return 0;
		});
		for (var i = 0; i<size; i++) {
			for (var j = 0; j<width; j++) { 
				ul.appendChild(newArr[i][j]);
				}
			}
		return false;
		}

</head>
<body>
<input type="button" value="Сортировать(возрастани е)" onclick="parse('sort',4,0);" />
<input type="button" value="Сортировать(возрастани е)" onclick="parse('sort',4,1);" />
<input type="button" value="Сортировать(возрастани е)" onclick="parse('sort',4,2);" />
<input type="button" value="Сортировать(возрастани е)" onclick="parse('sort',4,3);" />
<div id="sort">
<ul>
<li>Л</li>
<li>34</li>
<li>200 </li>
<li>1111f</li>
<li>К</li>
<li>10</li>
<li>10 </li>
<li>3333f</li>
<li>П</li>
<li>23</li>
<li>300 </li>
<li>2222f</li>
</ul>
</div>
</body>
</html>

Да, это простейшая сортировка - можно попробовать связать ее с моим скриптом...Но я думаю легче добавить пару слов в сам скрипт.Например преобразовать строки в числа - щас буду пробовать.

Буду пробовать parseFloatом, спасибо

Цитата:

Сообщение от formus

Дурной, штоле? Array.sort плевать на тип данных, который у тебя - всё приводится к строке и сравнивается посимвольно.

trikadin,
formus,верно понял свою проблему и нашёл решение ... имхо минус ему поставлен незаслуженно ... ниже возможный вариант ... строки преобразуются в число при сортировке если это возможно или остаются строкой если это невозможно ... строки 29-30

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang='ru-RU'>
<head>
<script type="text/javascript">
var $A = function(iterable) {
if (iterable) {
var result = [], i = iterable.length;
while (i) result[--i] = iterable[i];
return result;
}
return [];
};
function parse(sortWhat,width,what) {
var ul = document.getElementById(sortWhat).getElementsByTagName('ul')[0],
arr = $A(ul.getElementsByTagName('li'));
var size = arr.length/width;
var newArr = new Array (size);
for (var i = 0; i<size; i++) {
newArr[i] = new Array(width);
}
for (var i = 0; i<size; i++) {
for (var j = 0; j<width; j++) {
newArr[i][j] = arr[i*width+j];
}
}
newArr.sort(function(i, ii) {
i = i[what].innerHTML.toLowerCase();
ii = ii[what].innerHTML.toLowerCase();
i=parseFloat(i)||i;
ii=parseFloat(ii)||ii;
if (i > ii)
return 1;
else if (i < ii)
return -1;
else
return 0;
});
for (var i = 0; i<size; i++) {
for (var j = 0; j<width; j++) {
ul.appendChild(newArr[i][j]);
}
}
return false;
}
</script>
</head>
<body>
<input type="button" value="Сортировать(возрастание)" onclick="parse('sort',4,0);" />
<input type="button" value="Сортировать(возрастание)" onclick="parse('sort',4,1);" />
<input type="button" value="Сортировать(возрастание)" onclick="parse('sort',4,2);" />
<input type="button" value="Сортировать(возрастание)" onclick="parse('sort',4,3);" />
<div id="sort">
<ul>
<li>Л</li>
<li>34</li>
<li>200 </li>
<li>1111f</li>
<li>К</li>
<li>10</li>
<li>10 </li>
<li>3333f</li>
<li>П</li>
<li>23</li>
<li>300 </li>
<li>2222f</li>
</ul>
</div>
</body>
</html>

рони, вы правы, пожалуй... Невнимательно прочёл его сообщение)

Ну, я тоже человек)