JQuery Toggle State
Вот быстрый и тощий мой вопрос:
$("a").toggle(function() { /*function A*/ }, function() { /*function B*/ });
Внутри function A
отображается форма. Если пользователь успешно завершил форму, форма снова скрыта (возвращается к исходному состоянию).
Внутри function B
та же форма скрыта.
Теория, лежащая в основе этого, заключается в том, что пользователь может выбрать отображение формы и ее заполнение, или они могут снова щелкнуть и вернуть форму обратно в сокрытие.
Теперь мой вопрос таков: в настоящее время, если пользователь успешно заполняет форму - и она скрывается - пользователю нужно будет щелкнуть ссылку дважды, прежде чем вернуться к переключателю состояние, которое отображает форму.
В любом случае программно reset переключить тумблер в исходное состояние?
Ответы
Ответ 1
jQuery имеет два метода .toggle()
:
.toggle()
Переключает каждый из наборов согласованных элементы. Если они показаны, переключите делает их скрытыми. Если они скрыты, toggle показывает их.
.toggle(even, odd)
Переключить между двумя вызовами функций каждый раз.
В этом случае вы хотите первый. Что-то вроде этого должно сделать трюк:
$("a").click(function() {
$("#theForm").toggle();
});
Ответ 2
Вы можете проверить состояние переключателя в jQuery с помощью .is(":hidden")
. Итак, в базовом коде, что я использовал:
$("#div_clicked").click(function() {
if ($("#toggle_div").is(":hidden")) {
// do this
} else {
// do that
}
}); # add missing closing
Ответ 3
Вот что я использовал:
$(document).ready(function() {
$('#listing_position').click(function() {
var div_form = $('#listing_position_input');
if (div_form.hasClass('hide')) {
div_form.removeClass('hide');
} else {
div_form.addClass('hide');
}
});
});
Ответ 4
Ах, это простые вещи в жизни...
Я использовал последнее определение toggle(even,odd);
, но я забыл включить в свое первоначальное описание проблемы, что моя вторая функция переключения не только скрывала форму, но и уничтожала ее.
function A
: Ajax загружает форму в добавленный div. Скрыть и уничтожить div в успешном сообщении формы.
function B
: Уничтожьте div.
Вы оба напомнили мне, что toggle();
использует только свойство CSS, и поэтому он не подходит для этой задачи. Но потом я понял, что я излишне перезагружал форму в каждом "странном" состоянии, уничтожив ее, когда закончил, поэтому я в конце концов вернулся к этому:
$("link").click(function() {
if ($(this).siblings(".form-div").length == 0) {
// form is not loaded; load and show the form; hide when done
}
else {
$(this).siblings(".form-div").toggle();
}
});
... который делает то, что я хочу. Спасибо, что поставили меня прямо на toggle();
!
Ответ 5
Пошел с этим, чтобы избежать дополнительного класса hide/show.
Я думаю, что это более гибко, чем решение foxy, поскольку вы можете добавить больше функций внутри, но не цитируйте меня на том, что я noob
$("#clickie").click(function(){
if ( $("#mydiv").css("display") == "none" ){
$("#mydiv").show();
} else {
$("#mydiv").hide();
}
Ответ 6
$("#div_clicked").click(function() {
if ($("#toggle_div").is(":visible")) {
// do this
} else {
// do that
}
Заменить скрытые с видимыми