Показать сообщение отдельно
  #1 (permalink)  
Старый 18.12.2017, 12:20
Профессор
Отправить личное сообщение для Янковиц Посмотреть профиль Найти все сообщения от Янковиц
 
Регистрация: 17.11.2014
Сообщений: 403

Скрытие - показ элементов
Есть две одинаковые таблицы:
<table class="form-table no-border">
	<tbody>
		<tr class="parent">
			<th scope="row">Заголовок</th>
			<td>
				<label class="switch_wrap">
					<input name="option[ym]" id="ym" class="parent" value="1" type="checkbox">
				</label>
			</td>
		</tr>
		<tr>
			<th>Заголовок</th>
			<td>Текст</td>
		</tr>
	</tbody>
</table>
<table class="form-table no-border">
	<tbody>
		<tr class="parent">
			<th scope="row">Заголовок</th>
			<td>
				<label class="switch_wrap">
					<input name="option[ym]" id="ym" class="parent" value="1" type="checkbox">
				</label>
			</td>
		</tr>
		<tr>
			<th>Заголовок</th>
			<td>Текст</td>
		</tr>
	</tbody>
</table>

При изменении input parent на checked, нужно скрывать блок tr, который ниже.
Мой js такой:
$(document).ready(function(){
	var _this = $('.switch_wrap .parent');
	_this.change(function(){
		if (_this.prop('checked')) {
			_this.parents(3).nextAll('tr').fadeIn();
		} else {
			_this.parents(3).nextAll('tr').fadeOut();
		}
	});
	if (_this.prop('checked')) {
		_this.parents(3).nextAll('tr').fadeIn();
	} else {
		_this.parents(3).nextAll('tr').fadeOut();
	}
});

Однако, при переключении чекбокса из второй таблицы, скрытие и показ срабатывает только tr из первой
Ответить с цитированием