Форум

MikeRage · #1 (**permalink**) 24.11.2011, 15:49

простите я не силен в jquery, и встрял на такой проблеме:
есть некая таблица

<style>
.starthidden { display:none; }
</style>

<table width="100%" border="0">
<tr id='1'>
<td>текст1</td>
<td>текст2</td>
</tr>
<tr id='1' class='starthidden'>
<td>текст3</td>
<td>текст4</td>
</tr>
<tr id='2'>
<td>текст5</td>
<td>текст6</td>
</tr>
<tr id='2' class='starthidden'>
<td>текст7</td>
<td>текст8</td>
</tr>
.....
</table>

необходимо чтоб при нажатии на видимое поле появлялись все строки с таким же id как у объекта к которому идёт обращение.. таких строк в таблице очень много, поэтому полагаю что нужно использовать this, но никак не могу понять как описать сравнение id элементов и выполнение к ним скрипта.. подскажите пожалуйста!

ksa · #2 (**permalink**) 24.11.2011, 16:25

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

с таким же id как у объекта

Вообще-то ИД на странице должно быть уникально...

P.S.
У тебя в примере нет полей...

MikeRage · #3 (**permalink**) 24.11.2011, 16:30

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

Вообще-то ИД на странице должно быть уникально...

тогда как связать одну строку таблицы со второй?
т.е. я кликаю на строку, и снизу всплывает еще одна или несколько строк с какими то дополнительными данными, связанные с первоначальной строкой

ksa · #4 (**permalink**) 24.11.2011, 16:52

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

тогда как связать одну строку таблицы со второй?

Так ведь я твоей задачи незнаю... Х/з какой там у тебя тайный смысл в тех строках...

Как вариант, все строки имеют свой "порядковый номер" в табличке... У строк есть свойства ДОМ "следующий" и "предыдущий" элемент...

Есть такой атрибут как class например...

MikeRage · #5 (**permalink**) 24.11.2011, 17:11

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

Есть такой атрибут как class например...

ну я тож про class подумал потом...

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

Так ведь я твоей задачи незнаю... Х/з какой там у тебя тайный смысл в тех строках...

Как вариант, все строки имеют свой "порядковый номер" в табличке... У строк есть свойства ДОМ "следующий" и "предыдущий" элемент...

я же описал задачу, вот таблица, в таблице строки( <tr> </tr>) , первая строка видимая class='x', потом идут несколько строк с тем же class='x', только display:none... потом опять видимая строка class='y' , и опять строки class='y' display:none.. и т.д. таблица большая, количество невидимых строк после видмиой может быть разным... и надо чтоб при нажатии допустим строка class='x' появлялись строки с тем же классом функцией show("fast")
например :
$(document).ready(function(){
$('tr').click(function () {
var class = $(this).attr('class');
$('class').show("fast");
});

});
код отчасти бессмысленный потому что он не работает, переменной class я хотел как то сделать сравнение, но хз как...
алгоритм такой: кликаю на <tr>, находиться значение атрибута class, потом делается show ко всем объектам с таким же атрибутом...
и вот нифига не получается =(

walik · #6 (**permalink**) 24.11.2011, 17:29

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

$('class').show("fast");

Кавычки убери, так как используешь переменную:

$(class).show("fast");

MikeRage · #7 (**permalink**) 24.11.2011, 18:14

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

Кавычки убери, так как используешь переменную:

$(class).show("fast");

ясно спасибо.. т.е. остальное все верно? я просто не могу найти какую либо инфу про синтаксис, как это все описывается... тем щас встала задача в продолжение темы, чтоб появившиеся строки прятались обратно так же по нажатию, но тут уже проблема встает что надо спрятать только те которые были спрятаны, а если делать действие по class то спрячется и первая строка блока таблицы..
вот с синтаксисом реально косяк, даже про if не могу подобрать что да как.. а логика тут простая: если visible:none то show(), если visible:true(или как то там) то hide()...

ksa · #8 (**permalink**) 24.11.2011, 19:54

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

т.е. остальное все верно?

Не. Не верно...

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

я просто не могу найти какую либо инфу про синтаксис, как это все описывается...

Да брось!

Информации валом.

ksa · #9 (**permalink**) 24.11.2011, 20:15

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

щас встала задача в продолжение темы, чтоб появившиеся строки прятались обратно так же по нажатию

Как вариант...

<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<!--
<link rel="stylesheet" type="text/css" href="tmp.css" />
-->
<style type="text/css">
.starthidden { 
	display:none; 
}
#data tr {
	cursor: pointer;
}
</style>
<script type="text/javascript">
$(document).ready(function(){
	$('#data tr').click(function(){
		var group=$(this).attr('group');
		$('.starthidden[group='+group+']').toggle();
	});
});
</script>
</head>
<body>
<table id='data' width="100%" border="0">
	<tr group='1'>
		<td>текст1</td>
		<td>текст2</td>
	</tr>
	<tr group='1' class='starthidden'>
		<td>текст3</td>
		<td>текст4</td>
	</tr>
	<tr group='2'>
		<td>текст5</td>
		<td>текст6</td>
	</tr>
	<tr group='2' class='starthidden'>
		<td>текст7</td>
		<td>текст8</td>
	</tr>
</table>
</body>
</html>

Pavel M. · #10 (**permalink**) 24.11.2011, 23:13

а что за атрибут такой <tr group='...' ?

Форум

Справочник

Discord чат

Курсы javascript