У меня есть кнопка ("login_button"). Каждый раз, когда я нажимаю кнопку, я хочу, чтобы появился DIV ("login_cont"). И после того, как я щелкнул где-нибудь еще на странице, я хочу, чтобы этот DIV снова исчез.
Это мой код
$(document).ready(function(){
$('#login_button').click(function(e){
$('#login_cont').fadeIn();
});
$(document).click(function(e){
$('#login_cont').fadeOut();
});
});
Это выглядит хорошо для меня (я новичок в этом). Но. Каждый раз, когда я нажимаю кнопку, появляется div, но затем исчезает менее чем за секунду... почему и как я могу это исправить?
Поскольку оба события запускаются одновременно, вам необходимо остановитьпрограммирование:
$(document).ready(function(){
$('#login_button').click(function(e){
$('#login_cont').fadeIn();
e.stopPropagation();
});
$(document).click(function(e){
$('#login_cont').fadeOut();
});
});
Это связано с тем, что документ и #login_cont оба щелкнули (#login_cont является частью документа)
Вы можете исправить это, изменив
$(document).click(function(e){
$('#login_cont').fadeOut('slow');
});
в
$('#login_cont').onblur(function(e){
$('#login_cont').fadeOut('slow');
});
запретить распространение события кликов при нажатии кнопки входа в систему
$(document).ready(function(){
$('#login_button').click(function(event){
event.stopPropagation()
$('#login_cont').fadeIn();
});
$(document).click(function(e){
$('#login_cont').fadeOut();
});
});
Вы можете установить скорость замирания с количеством миллисекунд или просто назвав ее "медленной":
$('#login_button').click(function(e){
$('#login_cont').fadeIn(3000);
return false;
});
$(document).click(function(e){
$('#login_cont').fadeOut('slow');
return false;
});
Обновление (выше): возвращает false, чтобы предотвратить действие по умолчанию по умолчанию, если по умолчанию будет отправлен запрос по умолчанию.