У меня проблема с коробками открытия/закрытия. Предположим, что сценарий работает следующим образом: если одно окно открыто, когда пользователь нажимает на какой-либо другой, открытое поле должно быть закрыто и щелкнуть, нужно открыть. Когда ссылка (поле) открыта, в
тег должен быть вставлен class= "active", и когда ящик закрыт, этот класс следует удалить. Теперь пользователь может открыть все окна и все останутся открытыми, пока пользователь не нажмет на них снова, чтобы закрыть их. Алос с текущим кодом, когда пользователь открывает более двух ящиков, все коробки открываются после того, как эти два не получат "активный" класс. Я получаю сообщение об ошибке "Uncaught TypeError: Невозможно прочитать свойство" высота "неопределенного". Может ли кто-нибудь помочь мне решить эту проблему? Это код$(document).ready(onReady);
function onReady(){
$(".glossary").each(init);
}
var init=function(){var rootElement=this;
$("ul li:odd", rootElement).addClass("odd");
$("ul li:even", rootElement).addClass("even");
$(rootElement).delegate("ul li a", "click", function(e){
toggleItem($(this).next("div"), $("ul li div", rootElement));
})
}
var toggleItem =function (item, set){
if ($(item).hasClass("active")){
deactivateItem(item);
}
else{
activateItem(item, set);
}
}
var activateItem = function(item, set){
$(item).slideDown();
$(set).filter(".active").each(deactivateItem);
$(item).addClass("active");
}
var deactivateItem = function (item){
$(item).slideUp();
$(item).removeClass("active");
}
и это некоторый код HTML
<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-1.8.3.min.js"></script>
<script src="test1.js"></script>
</head>
<body>
<div class="glossary">
<ul>
<li >
<a href="#">Rose</a>
<div class="" style="display: none;">A rose is a woody perennial of the genus Rosa, within the family Rosaceae. There are over 100 species.</div>
</li>
<li >
<a href="#">Camomile</a>
<div class="" style="display: none;">Chamomile or camomile is the common name for several daisy-like plants of the family Asteraceae that are commonly used to make a herb infusion that can help to induce sleep</div>
</li>
<li >
<a href="#">Mentha</a>
<div class="" style="display: none;">Mentha is a genus of plants in the family Lamiaceae (mint family).The species are not clearly distinct and estimates of the number of species varies from 13 to 18.</div>
</li>
<li >
<a href="#">Viola</a>
<div class="" style="display: none; overflow: hidden;">Viola is a genus of flowering plants in the violet family Violaceae. It is the largest genus in the family, containing between 525 and 600 species.</div>
</li>
</ul>
</div>
</body>
</html>
Проблема заключается в том, что объект jQuery не передается функции deactivateItem
.
JQuery each
проходит выбор JQuery с помощью this
. Ваша функция deactivateItem
ожидает, что выбор jQuery будет передан как первый item
аргумента. Призыв к each
в activateItem
не учитывает это.
Это проблематичная линия:
$(set).filter(".active").each(deactivateItem);
Вероятно, вы хотите изменить его на что-то вроде:
$(set).filter(".active").each(function() {
deactivateItem(this);
});
height
объекта.