Почему jQuery игнорирует содержимое моего div?

#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();

});

});