Блог

Ни за что на свете я, похоже, не смогу это взломать. Я довольно новичок в jQuery, но я пытаюсь просто:

Ссылка, по которой я действую, ведет на /mypagename

1. При первом нажатии на.nav_hidepanel запустите анимацию #panel , но НЕ разрешайте ссылке функционировать как обычно. Однако добавьте класс замены .nav_returnlink , чтобы мы могли настроить его в следующий раз
2. Теперь, при втором нажатии на эту ссылку, у нее другой класс, поэтому мы хотим разрешить ей функционировать как обычно и отправить пользователя в / mypagename

Нет проблем с отключением ссылки, но return true; просто, похоже, не работает! Я упускаю что-то очевидное?

 jQuery(document).ready(function(){
    $("a.nav_hidepanel").click(function(e){
        e.preventDefault();
        $("#panel").animate({marginLeft:"-547px"}, 500 );
        $(this).removeClass('nav_hidepanel');
        $(this).addClass('nav_returnlink');
    });

    $("a.nav_returnlink").click(function(){
        return true;
    });
});
  

Поскольку у элемента будет nav_returnlink класс после первого щелчка, просто проверьте его наличие:

 jQuery(document).ready(function(){
    $("a.nav_hidepanel").click(function(e){
        //This will return true after the first click 
        //and preventDefault won't be called.
        if(!$(this).hasClass('nav_returnlink'))
            e.preventDefault();

        $("#panel").animate({marginLeft:"-547px"}, 500 );
        $(this).removeClass('nav_hidepanel');
        $(this).addClass('nav_returnlink');
    });
});
  

Вот краткое объяснение того, почему ваш код не работал:

• Вы связываете событие click на.nav_hidepanel с preventDefault это нормально
• Вы привязываете событие щелчка к элементу a.nav_returnlink, который на данный момент не существует. это проблема
• При обратном вызове при первом нажатии вы вызываете e.preventDefault(), поскольку это событие щелчка никогда не отключается, эта ссылка никогда не выполнит действие по умолчанию. это снова проблема

Вот возможное решение

 jQuery(document).ready(function(){
  $("a.nav_hidepanel").click(function(e){
    e.preventDefault();
    $("#panel").animate({marginLeft:"-547px"}, 500 );
    $(this).removeClass('nav_hidepanel');
    $(this).addClass('nav_returnlink');
    $(this).unbind('click'); //unbind the click event so this is not called again
  });
  $("a.nav_returnlink").live(function(){ //use a live event to bind to this element, that is available in the future
      return true;
  });
});
  

Другим решением может быть привязка нового события click при первом обратном вызове:

 jQuery(document).ready(function(){
  $("a.nav_hidepanel").click(function(e){
    e.preventDefault();
    $("#panel").animate({marginLeft:"-547px"}, 500 );
    $(this).removeClass('nav_hidepanel');
    $(this).addClass('nav_returnlink');
    $(this).unbind('click');

    $(this).click(function(){
        //do whatever you like to do
    });
  });
});
  

Попробуйте добавить событие щелчка в живую функцию с помощью jquery

 $("a.nav_returnlink").live("click",function(){
   return true;
});
  

Почему бы вместо этого не использовать счетчик?

 var clickCount = 0;
$("a.nav_hidepanel").click(function(e){
    if(clickCount == 0) {
        e.preventDefault();
        $("#panel").animate({marginLeft:"-547px"}, 500 );
    }
    clickCount  ;
});
  

вы всегда можете просто отключить обработчик событий….

 var clickCancel = function(event) {
    event.preventDefault();
    $(this).unbind("click",clickCancel);
    $("#panel").animate({marginLeft:"-547px"}, 500 );// you add your animation in this function, it will only be called on  the first click..

};
$("a.nav_hidepanel").bind("click", clickCancel);
  

смотрите здесь

Здравствуйте, может ли эта статья помочь вам

http://bolsterweb.com/2010/12/preventing-accidental-double-clicks-on-links-using-jquery/