#jquery #css #toggle
#jquery #css #переключить
Вопрос:
У меня есть простой переключатель для div, прикрепленного к чекбоксу.
$('#step2').hide();
$('#toggle-check').click(function(){
$('#step2').fadeToggle();
})
Почему .hide(); не выбирает мое содержимое #step2 ? В настоящее время это список табличных данных, и он их не скрывает. Я закончу свой div пораньше, и это сработает.
<tr>
<th></th>
<td></td>
</tr>
В настоящее время он добавляет мой #step2 div поверх всех моих табличных данных, поэтому я чувствую, что это может быть проблема с CSS-стилем?
Комментарии:
1. Где
#step2
и что он содержит? Можете ли вы опубликовать соответствующие части кода?2. #step2 обернут вокруг приведенной выше структуры таблицы, которую я дал. Присвоение каждой строке класса hide и вызов его в jquery работает, но это грязно, нет?
3. Есть ли
table
элемент вокруг разметки, которую вы тоже указали (внутриdiv
)? Если нет, то это недействительно.4. Ладно, я не знал этого о jQuery. Спасибо 🙂
5. Речь идет не о jQuery, а о HTML. Если HTML неверен, вы понятия не имеете, что браузер сделает, чтобы попытаться исправить это, и тогда jQuery тоже не будет знать, что делать, потому что вся разметка изменилась.
Ответ №1:
Если вы оборачиваете свой div #step2 вокруг строки таблицы, это не сработает, потому что это неправильная разметка. Вы должны обернуть им весь стол. Если вы хотите сохранить части таблицы, вы должны структурировать ее по-другому.
Ответ №2:
Это может быть связано с тем, что ваш код не выполняется, когда документ готов. Это означает, что он может выполняться, если ваша страница очень короткая, но не если вся таблица еще не проанализирована.
Попробуй это:
$(document).ready(
{
$('#step2').hide();
$('#toggle-check').click(function()
{
$('#step2').fadeToggle();
})
});
Ответ №3:
судя по вашим вопросам, я не могу сказать многого.
а также вы пропустили здесь точку с запятой
$('#toggle-check').click(function(){
$('#step2').fadeToggle();
})
попробуйте обернуть свой код внутрь $(document).ready(function(){});
и добавить точку с запятой
$(document).ready(function(){
$('#step2').hide();
$('#toggle-check').click(function(){
$('#step2').fadeToggle();
});
});