|
|
15.02.2013, 12:33
|
|
Аспирант
|
|
Регистрация: 03.11.2011
Сообщений: 42
|
|
|
Упорядочить элементы
Здравствуйте!
Есть список дивов с id="a" и "b". Они идут в произвольном порядке. Как их разместить, чтобы сначала шли дивы id="a", за ними id="b"
Спасибо!
|
|
15.02.2013, 12:59
|
|
Профессор
|
|
Регистрация: 12.12.2012
Сообщений: 1,398
|
|
|
Чтобы переставить элемент относительно другого элемента можно использовать .insertBefore() и .insertAfter() jQuery
Я бы сделал массив с алфавитом, брал id, сравнивал первую букву с элементом массива... Короче в итоге вы получаете чуть более расширенную задачу чем сортировка массива.
Последний раз редактировалось tsigel, 15.02.2013 в 13:05.
|
|
15.02.2013, 14:01
|
|
без статуса
|
|
Регистрация: 25.05.2012
Сообщений: 8,219
|
|
<script src="http://code.jquery.com/jquery-latest.js"></script>
<div class=WRP>
<div id=d>id=d</div>
<div id=b>id=b</div>
<div id=c>id=c</div>
<div id=a>id=a</div>
</div>
<script>
var divs =$('div[id]');
var arr=[];
for (var i=0;i<divs.length;i++) {
arr.push(divs.eq(i).attr('id'));
}
arr = arr.sort();
for (var i=0;i<arr.length;i++) {
$('#'+arr[i]).appendTo('.WRP');
}
</script>
Последний раз редактировалось Deff, 15.02.2013 в 14:06.
|
|
15.02.2013, 14:52
|
 |
Профессор
|
|
Регистрация: 27.05.2010
Сообщений: 33,070
|
|
Вариант ...
<!DOCTYPE HTML>
<html>
<head>
<title></title>
</head>
<body>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<div class=WRP>
<div id=d>id=d</div>
<div id=b>id=b</div>
<div id=c>id=c</div>
<div id=a>id=a</div>
</div>
<script>
var divs =$('.WRP div');
var arr = jQuery.makeArray(divs).sort(function f(a,b)
{
var c = 0
if (a.id > b.id ) c = 1;
if (a.id < b.id ) c = -1;
return c
});
$(arr).appendTo('.WRP')
</script>
</body>
</html>
|
|
15.02.2013, 15:01
|
|
Профессор
|
|
Регистрация: 27.05.2010
Сообщений: 33,070
|
|
Вариант для ненормально одинаковых id
<!DOCTYPE HTML>
<html>
<head>
<title></title>
</head>
<body>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<div class=WRP>
<div id=a>id=a</div>
<div id=a>id=a</div>
<div id=b>id=b</div>
<div id=b>id=b</div>
</div>
<script>
var divs_a =$('.WRP div[id="a"]');
var divs_b =$('.WRP div[id="b"]');
divs_a.each(function(indx, element){
$(element).appendTo('.WRP');
divs_b.eq(indx).appendTo('.WRP')
});
</script>
</body>
</html>
|
|
15.02.2013, 15:05
|
 |
CacheVar
|
|
Регистрация: 19.08.2010
Сообщений: 14,123
|
|
|
Сообщение от nule
|
|
Как их разместить, чтобы сначала шли дивы id="a", за ними id="b"
|
Предложу такой вариант...
<script type="text/javascript">
function sort() {
var ob=document.getElementById('box');
var move,oa,i;
do {
oa=ob.getElementsByTagName('div');
move=false;
for (i=1; i<oa.length; i++) {
if (oa[i-1].id>oa[i].id) {
ob.insertBefore(oa[i],oa[i-1]);
move=true;
};
};
} while (move)
}
</script>
<div id='box'>
<div id='d'>id=d</div>
<div id='b'>id=b</div>
<div id='c'>id=c</div>
<div id='a'>id=a</div>
</div>
<button onclick='sort()'>Sort</div>
|
|
15.02.2013, 16:19
|
|
Аспирант
|
|
Регистрация: 03.11.2011
Сообщений: 42
|
|
Сообщение от рони
|
Вариант для ненормально одинаковых id
<!DOCTYPE HTML>
<html>
<head>
<title></title>
</head>
<body>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<div class=WRP>
<div id=a>id=a</div>
<div id=a>id=a</div>
<div id=b>id=b</div>
<div id=b>id=b</div>
</div>
<script>
var divs_a =$('.WRP div[id="a"]');
var divs_b =$('.WRP div[id="b"]');
divs_a.each(function(indx, element){
$(element).appendTo('.WRP');
divs_b.eq(indx).appendTo('.WRP')
});
</script>
</body>
</html>
|
Виноват, пожалуй неточно сформулировал задачу. Плюс еще забыл про уникальность id.
Дивы с классами всего двух типов, a и b. Изначальное количество и порядок следования произвольны. Пересортировать, чтобы сначала шли только а, потом только b.
Код в цитате для случая b b a дал результат b a b 
Спасибо! |
|
15.02.2013, 16:22
|
|
Профессор
|
|
Регистрация: 27.05.2010
Сообщений: 33,070
|
|
nule,
<!DOCTYPE HTML>
<html>
<head>
<title></title>
</head>
<body>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<div class=WRP>
<div id=b>id=b</div>
<div id=b>id=b</div>
<div id=a>id=a</div>
</div>
<script>
var divs =$('.WRP div');
var arr = jQuery.makeArray(divs).sort(function f(a,b)
{
var c = 0
if (a.id > b.id ) c = 1;
if (a.id < b.id ) c = -1;
return c
});
$(arr).appendTo('.WRP')
</script>
</body>
</html>
|
|
15.02.2013, 16:26
|
|
Профессор
|
|
Регистрация: 27.05.2010
Сообщений: 33,070
|
|
nule,
или так
<!DOCTYPE HTML>
<html>
<head>
<title></title>
</head>
<body>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<div class=WRP>
<div id=a>id=a</div>
<div id=b>id=b</div>
<div id=b>id=b</div>
<div id=a>id=a</div>
</div>
<script>
var divs_a =$('.WRP div[id="a"]');
var divs_b =$('.WRP div[id="b"]');
divs_a.appendTo('.WRP');
divs_b.appendTo('.WRP')
</script>
</body>
</html>
|
|
15.02.2013, 16:51
|
|
Аспирант
|
|
Регистрация: 03.11.2011
Сообщений: 42
|
|
|
Сообщение от рони
|
nule,
или так
<!DOCTYPE HTML>
<html>
<head>
<title></title>
</head>
<body>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<div class=WRP>
<div id=a>id=a</div>
<div id=b>id=b</div>
<div id=b>id=b</div>
<div id=a>id=a</div>
</div>
<script>
var divs_a =$('.WRP div[id="a"]');
var divs_b =$('.WRP div[id="b"]');
divs_a.appendTo('.WRP');
divs_b.appendTo('.WRP')
</script>
</body>
</html>
|
Этот вариант работает, спасибо! |
|
|
|
