Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 11.08.2013, 16:36
Аспирант
Отправить личное сообщение для zevilz Посмотреть профиль Найти все сообщения от zevilz
 
Регистрация: 24.05.2012
Сообщений: 93

поиск элемента по одному по части значения атрибута
есть страница с элементами с атрибутом rel, в котором прописаны id:
<p rel='1'></p>
<p rel='3'></p>
<p rel='10'></p>
....

происходит выборка с определенным значением id:
$('p[rel='+id+']') {...};

и выборка элементов с значениями не равными id:
$('p[rel!='+id+']') {...};

необходимо сделать такую же выборку при условии, что в rel может быть прописано несколько id через пробелы:
<p rel='1 14 20'></p>
<p rel='2 7 11'></p>
<p rel='44 3 33'></p>
....

Пробовал использовать ~= вместо =, но не работает.

Последний раз редактировалось zevilz, 11.08.2013 в 16:47.
Ответить с цитированием
  #2 (permalink)  
Старый 11.08.2013, 16:47
без статуса
Отправить личное сообщение для Deff Посмотреть профиль Найти все сообщения от Deff
 
Регистрация: 25.05.2012
Сообщений: 8,219

$('p[rel!="'+id1+' '+id2+' '+id3+'"]');
Ответить с цитированием
  #3 (permalink)  
Старый 11.08.2013, 16:49
Аспирант
Отправить личное сообщение для zevilz Посмотреть профиль Найти все сообщения от zevilz
 
Регистрация: 24.05.2012
Сообщений: 93

Сообщение от Deff Посмотреть сообщение
$('p[rel!="'+id1+' '+id2+' '+id3+'"]');
количество id в rel может быть любое количество, а id ищется 1
Ответить с цитированием
  #4 (permalink)  
Старый 11.08.2013, 16:55
без статуса
Отправить личное сообщение для Deff Посмотреть профиль Найти все сообщения от Deff
 
Регистрация: 25.05.2012
Сообщений: 8,219

zevilz,
Тут ищется не id - а контент атрибута
Ответить с цитированием
  #5 (permalink)  
Старый 11.08.2013, 17:00
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,105

zevilz,
$('p[rel~='+id+']')
Ответить с цитированием
  #6 (permalink)  
Старый 11.08.2013, 17:02
Аспирант
Отправить личное сообщение для zevilz Посмотреть профиль Найти все сообщения от zevilz
 
Регистрация: 24.05.2012
Сообщений: 93

Сообщение от рони Посмотреть сообщение
zevilz,
$('p[rel~='+id+']')
не работает почему-то
Ответить с цитированием
  #7 (permalink)  
Старый 11.08.2013, 17:05
без статуса
Отправить личное сообщение для Deff Посмотреть профиль Найти все сообщения от Deff
 
Регистрация: 25.05.2012
Сообщений: 8,219

<script src="http://code.jquery.com/jquery-latest.js"></script>

  <script>
  $(document).ready(function(){
    var id1=2,id2=7,id3=11;
    var summ = ''+id1+' '+id2+' '+id3;
    $('p[rel="'+summ+'"]').each(function(){
          alert($(this).html());
    });
  });
  </script>
<p rel='1 14 20'>1 14 20</p>
<p rel='2 7 11'>2 7 11</p>
<p rel='44 3 33'>44 3 33</p>
Ответить с цитированием
  #8 (permalink)  
Старый 11.08.2013, 17:06
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,105

Сообщение от zevilz
не работает почему-то
смотрите что у вас не так
<!DOCTYPE HTML>

<html>

<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
</head>

<body>
<p rel='1 14 20'>12345</p>
<p rel='2 7 11'>12345</p>
<p rel='44 3 33'>12345</p>
<script>
var id = 1;
$('p[rel~='+id+']').css('background','red')
</script>

</body>

</html>
Ответить с цитированием
  #9 (permalink)  
Старый 11.08.2013, 17:17
Аспирант
Отправить личное сообщение для zevilz Посмотреть профиль Найти все сообщения от zevilz
 
Регистрация: 24.05.2012
Сообщений: 93

id передается только 1
вот полная версия скрипта:
<script src="http://code.jquery.com/jquery-latest.js"></script>

  	<script type="text/javascript">
			
			$(document).ready(function() {
				
				$('.menu li a').click(function() {
								
					$('.menu li').removeClass('selected');
					$(this).parent('li').addClass('selected');
					
					imgWidth = '52px';
					thisItem 	= $(this).attr('rel');
					
					if(thisItem != "all") {
					
						$('.item li[rel='+thisItem+']').stop()
																.animate({'width' : imgWidth, 
																			 'opacity' : 1, 
																			 'marginRight' : '.5em', 
																			 'marginLeft' : '.5em'
																			});
																			
						$('.item li[rel!='+thisItem+']').stop()
																.animate({'width' : 0, 
																			 'opacity' : 0,
																			 'marginRight' : 0, 
																			 'marginLeft' : 0
																			});
					} else {
						
						$('.item li').stop()
										.animate({'opacity' : 1, 
													 'width' : imgWidth, 
													 'marginRight' : '.5em', 
													 'marginLeft' : '.5em'
													});
					}
				})
				
				$('.item li img').animate({'opacity' : 0.5}).hover(function() {
					$(this).animate({'opacity' : 1});
				}, function() {
					$(this).animate({'opacity' : 0.5});
				});
				
			});
			
		  </script>
<style>
ul {
	margin: 0;
	text-align: left;
}

ul.menu {
	margin-left: .5em;
	margin-bottom: 1em;
}

ul.menu li {
	list-style-type: none;
	display: inline-block;
	font-weight: bold;
	text-shadow: 1px 1px 0px #f3f5da;
	padding: 2px 15px;
}
	
	.selected {
		-webkit-border-radius: 15px;
		-moz-border-radius: 5px;
		border-radius: 5px;
		background: #acac75;
		-webkit-box-shadow: 1px 1px 0px #8c8c5d;
	}
	
	.selected a, .selected a:visited {
		text-shadow: 1px 1px 0px #8c8c60;
		color: #fff;
	}

ul.item li {
	list-style-type: none;
	display: block;
	float: left;
	margin: .5em;
}
	
	ul.item li img {
		border: 5px solid #fff;
		-webkit-border-radius: 5px;
		-moz-border-radius: 5px;
		border-radius: 5px;
		-webkit-box-shadow: 0px 0px 5px #ac987e;
		-moz-box-shadow: 0px 0px 5px #ac987e;
		box-shadow: 0px 0px 5px #ac987e;
	}


a, a:visited {
	color: #161616;
	text-decoration: none; 
}
</style>
	<ul class="menu">
		<li class="selected"><a href="#" rel="all">Все уроки</a></li>
		<li><a href="#" rel="jquery">jQuery</a></li>
		<li><a href="#" rel="css">CSS</a></li>
		<li><a href="#" rel="php">PHP</a></li>
	</ul>
	
	<ul class="item">
		<li rel="jquery"><a href="" target="_blank"><img src="rhttgbh" /></a></li>
		<li rel="jquery"><a href="" target="_blank"><img src="edhdethg" /></a></li>
		<li rel="css"><a href="" target="_blank"><img src="hetrheth" /></a></li>
		<li rel="css"><a href="" target="_blank"><img src="rthrtg" /></a></li>
		<li rel="php"><a href="" target="_blank"><img src="ethetrh" /></a></li>
		<li rel="jquery"><a href="" target="_blank"><img src="hetr" /></a></li>
		<li rel="css"><a href="" target="_blank"><img src="werhewrt" /></a></li>
		<li rel="php"><a href="" target="_blank"><img src="wtrhwetr" /></a></li>
	</ul>
Ответить с цитированием
  #10 (permalink)  
Старый 11.08.2013, 17:28
без статуса
Отправить личное сообщение для Deff Посмотреть профиль Найти все сообщения от Deff
 
Регистрация: 25.05.2012
Сообщений: 8,219

zevilz,
1. у Вас тут +thisItem+' , а не id
И оно единственное.. ибо как то нужно проверять соседние элементы
если нун втащить из str='1 22 55'
str='1 22 55'
var arr = str.split(/\s+/);

alert(arr[0]);

alert(arr[1]);

alert(arr[2])
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Поиск тега по значению его атрибута. frant32 Events/DOM/Window 12 03.06.2012 21:30
Получение значения соседнего элемента Max Tretyakov Events/DOM/Window 2 27.06.2011 22:01
Изменение значения атрибута. tiros jQuery 0 05.05.2011 00:13
Изменение значения атрибута. tiros jQuery 0 05.05.2011 00:06
Нахождение элемента в видимой части контейнера со скроллом kidar2 Events/DOM/Window 0 21.05.2010 10:50