Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 20.12.2013, 13:28
Новичок на форуме
Отправить личное сообщение для BesTime Посмотреть профиль Найти все сообщения от BesTime
 
Регистрация: 20.12.2013
Сообщений: 6

Блокировка запуска скрипта при повторном нажатии если скрипт досих пор выполняется
Пытаюсь сделать скрипт мини профиля при клике по которому увеличивается ширина блока и появляются кнопки.
Все получилось, но если я продолжаю кликать на профиль несколько раз, то он начинает открываться закрываться. Я как понимаю что пока скрипт выполняется, при повторном клике запускается опять функция.
Как слеть чтобы во время выполнения функции при повторном клике она не запускалась заного а только после завешения выполнения реагировала на клик
вот код:
$(document).ready(function(){
    var lastwidth = $("#mini_profile").width();
    
	
      $("#mini_profile").click(function () {
	         $("#mini_profile").animate({width:"200px"});
			 setTimeout(function(){
			    $("#exit2").fadeIn("slow");
			 },500);
			 
			 setTimeout(function(){
			      $("#exit2").hide();
			 },4000);
			
			 setTimeout(function(){
			     $("#mini_profile").animate({width:lastwidth});
			 },4500);
	  });
	  

});
Ответить с цитированием
  #2 (permalink)  
Старый 20.12.2013, 14:51
Аватар для mi.rafaylik
Кандидат Javascript-наук
Отправить личное сообщение для mi.rafaylik Посмотреть профиль Найти все сообщения от mi.rafaylik
 
Регистрация: 07.12.2012
Сообщений: 113

Проверять доступ к выполнению функции через переменную:
$(document).ready(function(){

	var accessAction = 1; // изначально разрешаем доступ к выполнению функции
	var lastwidth = $("#mini_profile").width();

	$("#mini_profile").click(function(){
		if (accessAction) { // проверяем разрешён ли доступ
			accessAction = 0; // мы уже внутри, теперь блокируем повторное выполнение функции
			$("#mini_profile").animate({width:"200px"}, "slow");
			setTimeout(function(){
				$("#exit2").fadeIn("slow");
			}, 500);
			setTimeout(function(){
				$("#exit2").hide();
			}, 4000);
			setTimeout(function(){
				$("#mini_profile").animate({width:lastwidth}, "slow", function(){ // используем callback анимации
					accessAction = 1; // последняя анимация завершилась, снимаем блокировку доступа
				});
			}, 4500);
		}
	});

});

Последний раз редактировалось mi.rafaylik, 20.12.2013 в 15:48.
Ответить с цитированием
  #3 (permalink)  
Старый 20.12.2013, 15:00
Аватар для ksa
ksa ksa вне форума
CacheVar
Отправить личное сообщение для ksa Посмотреть профиль Найти все сообщения от ksa
 
Регистрация: 19.08.2010
Сообщений: 14,124

Сообщение от BesTime
Как слеть чтобы во время выполнения функции при повторном клике она не запускалась заного а только после завешения выполнения реагировала на клик
Как вариант...

<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<!--
<link rel="stylesheet" type="text/css" href="tmp.css" />
-->
<style type="text/css">
</style>
<script type="text/javascript">
$(function (){
	$('a').click(function (){
		action(this);
	});
});
function action(Obj) {
	$(Obj).unbind('click');
	setTimeout(function(){
		alert(1);
		$(Obj).click(function (){
			action(this);
		});
	},5000);
};
</script>
</head>
<body>
<a href='#'>test</a>
</body>
</html>
Ответить с цитированием
  #4 (permalink)  
Старый 20.12.2013, 15:59
Аватар для danik.js
Профессор
Отправить личное сообщение для danik.js Посмотреть профиль Найти все сообщения от danik.js
 
Регистрация: 11.09.2010
Сообщений: 8,804

<!DOCTYPE html>
<a href="#">test</a>
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<script>
(function(){

var busy = false;
$('a').click(function (){
    if (busy)
        return;
    busy = true;
    setTimeout(function(){
        alert(1);
        busy = false;
    },5000);
});

})();
</script>
__________________
В личку только с интересными предложениями
Ответить с цитированием
  #5 (permalink)  
Старый 20.12.2013, 17:24
Аватар для Vlasenko Fedor
Профессор
Отправить личное сообщение для Vlasenko Fedor Посмотреть профиль Найти все сообщения от Vlasenko Fedor
 
Регистрация: 13.03.2013
Сообщений: 1,572

зачем используем тег <a> не по назначению
<style>
      .link {
        border:none;
        background-color: transparent;
        text-decoration: underline;
        color: #476C8E;
      }
      .link:hover {
        cursor: pointer;
      }
      .link:focus {
        outline: none;
      }
    </style>
  </head>
  <body>
    <input type="button" onclick="openForm(this)" value="Нажми меня" class="link">
    <script>
      var openForm = function (el) {
          el.disabled = 1;
          setTimeout(function () {
            alert(1);
            el.disabled = 0;
          }, 3000);
        };
    </script>
  </body>

Последний раз редактировалось Vlasenko Fedor, 20.12.2013 в 20:43.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Смена картинки кнопки при нажатии и обратно при повторном нажатии mff Общие вопросы Javascript 15 03.05.2018 14:12
Блок должен перемещаться из одной точки в другую, а при повторном нажатии обратно Ser12345678 jQuery 2 17.07.2012 12:18
Если один уже открыт и при нажатии на ссылку два первый блок скрывался и открывался ybiza Элементы интерфейса 3 16.12.2010 22:24
Открыть в новом окне, а при повторном нажатии обновить то же старое-новое окно libinstyle Events/DOM/Window 2 05.04.2010 20:13
Выполнение скрипта при нажатии Entet в текстовм поле Vlasssov Общие вопросы Javascript 4 23.08.2009 23:31