jQuery slideToggle не работает с тегами списка - PullRequest
Новая
       42

jQuery slideToggle не работает с тегами списка

0 голосов
/ 03 мая 2011

По какой-то причине я не могу заставить свой SlideToggle работать.Мой список «TellusMore» настроен на отображение: нет сразу, и когда вы щелкаете по классу «Tellustoday», я хочу, чтобы список SlideToggle (дисплей). 

<div id="tellus">
    <h2>Have You Used This Product?</h2>
        <span class="tellustoday">Click Here to tell us about it!</span>
        <ul class="tellusmore">
           <li id="sendreview"><a href="">Write a quick review</a></li>
           <li id="sendpicture"><a href="">Send us pictures of your unit</a></li>
           <li id="sendvideo"><a href="">Send us a video of your product</a></li>
        </ul>
</div>

$(".tellustoday").click(function () {
 $('.tellusmore').slideToggle("fast");
});

#tellus {
-moz-border-radius: 4px 4px 4px 4px;
background-color: white;
border: 1px solid #E8E8E8;
line-height: normal;
padding: 15px 6px 15px 6px;
margin-bottom:10px;
}
#tellus h2{
color: #004B6C;
font-size: 20px;
text-transform: uppercase;
font-family: georgia,serif;
text-align: center;
font-weight: bold;
margin:5px 2px;
}
.tellustoday {
color: #004B6C;
text-decoration: underline;
text-transform: none;
font-weight: normal;
font-size: 14px;
cursor: pointer;
}
.tellusmore { display:none; }

Ответы [ 3 ]

2 голосов
/ 03 мая 2011

Кажется, что вы генерируете контент с помощью HTML в своей функции jQuery ready, что нормально. Проблема заключается в том, что ваш код javascript для привязки события находится в отдельном теге <script>, что означает, что оно будет выполнено сразу после его анализа, почти наверняка, прежде чем ваш контент будет вставлен в DOM при событии ready jQuery.

Решение состоит в том, чтобы привязать событие к событию сразу после вставки содержимого в готовую функцию или обернуть его в собственную готовую функцию. Несколько готовых функций выполняются в порядке их разбора, поэтому убедитесь, что ваша вставка проанализирована до привязки события.

Никогда не рекомендуется использовать функции jQuery до загрузки DOM, даже если вы хотите немедленно запустить какой-нибудь скрипт, оберните его в готовую функцию. Это гарантирует, что DOM и jQuery полностью загружены. Используйте $(function(){...} для простоты.

1 голос
/ 03 мая 2011

где именно вы привязали свой код? 

$(".tellustoday").click(function () {
 $('.tellusmore').slideToggle("fast");
});

Потому что на вашей живой странице он не выдает никаких ошибок или ничего не делает ...

Может бытьвам нужно поместить его в document.ready () ..

Можете ли вы проверить, поместив какое-нибудь предупреждение или оператор console.log перед вызовом slideToggle ()?

1 голос
/ 03 мая 2011

Кажется, у меня работает: http://jsfiddle.net/UUsBm/.

Вы добавили ссылку на jQuery на своей странице?

Есть ли другие javascript или css на вашей странице, которые могут конфликтовать с этим?

...