Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 15.02.2013, 12:33
Аспирант
Отправить личное сообщение для nule Посмотреть профиль Найти все сообщения от nule
 
Регистрация: 03.11.2011
Сообщений: 42

Упорядочить элементы
Здравствуйте!
Есть список дивов с id="a" и "b". Они идут в произвольном порядке. Как их разместить, чтобы сначала шли дивы id="a", за ними id="b"
Спасибо!
Ответить с цитированием
  #2 (permalink)  
Старый 15.02.2013, 12:59
Профессор
Отправить личное сообщение для tsigel Посмотреть профиль Найти все сообщения от tsigel
 
Регистрация: 12.12.2012
Сообщений: 1,398

Чтобы переставить элемент относительно другого элемента можно использовать .insertBefore() и .insertAfter() jQuery

Я бы сделал массив с алфавитом, брал id, сравнивал первую букву с элементом массива... Короче в итоге вы получаете чуть более расширенную задачу чем сортировка массива.

Последний раз редактировалось tsigel, 15.02.2013 в 13:05.
Ответить с цитированием
  #3 (permalink)  
Старый 15.02.2013, 14:01
без статуса
Отправить личное сообщение для Deff Посмотреть профиль Найти все сообщения от Deff
 
Регистрация: 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.
Ответить с цитированием
  #4 (permalink)  
Старый 15.02.2013, 14:52
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,105

Вариант ...
<!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>
Ответить с цитированием
  #5 (permalink)  
Старый 15.02.2013, 15:01
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,105

Вариант для ненормально одинаковых 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>
Ответить с цитированием
  #6 (permalink)  
Старый 15.02.2013, 15:05
Аватар для ksa
ksa ksa вне форума
CacheVar
Отправить личное сообщение для ksa Посмотреть профиль Найти все сообщения от ksa
 
Регистрация: 19.08.2010
Сообщений: 14,205

Сообщение от 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>
Ответить с цитированием
  #7 (permalink)  
Старый 15.02.2013, 16:19
Аспирант
Отправить личное сообщение для nule Посмотреть профиль Найти все сообщения от nule
 
Регистрация: 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
Спасибо!
Ответить с цитированием
  #8 (permalink)  
Старый 15.02.2013, 16:22
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,105

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>
Ответить с цитированием
  #9 (permalink)  
Старый 15.02.2013, 16:26
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,105

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>
Ответить с цитированием
  #10 (permalink)  
Старый 15.02.2013, 16:51
Аспирант
Отправить личное сообщение для nule Посмотреть профиль Найти все сообщения от nule
 
Регистрация: 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>
Этот вариант работает, спасибо!
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Скрыть/показать элементы в зависимости от значения select AnyKeyLeft Элементы интерфейса 12 16.07.2014 16:26
Выбрать элементы, в которые вложен элемент с id. Вадимчег jQuery 3 24.11.2012 10:38
Не могу удалить клонируемые элементы ViktorCore Элементы интерфейса 11 20.12.2011 20:24
Событие на динамически созданные элементы списка Arigato Events/DOM/Window 7 12.12.2011 09:28
Выбрать все элементы, имеющие id rockerror Events/DOM/Window 4 07.11.2011 15:04