2009-12-17 77 views
2

我试图在链接被点击后不可点击链接,点击链接后点击链接。基本上只是一个切换,但我需要使活动链接不可点击以防止切换。这里是我的代码:一旦点击了链接,就不可点击链接 - jquery

$(document).ready(function(){ 
     $("#Espanol").hide(); 
     $("#espLink").addClass("nonSelected");   
     // Make english link unclickable 
     $("#espLink").click(function(){ 
      $("#engLink").addClass("nonSelected"); 
      $("#espLink").removeClass("nonSelected"); 
      $("#English").toggle(); 
      $("#Espanol").toggle();  
      // need to make espanol link unclickable 
      // and english link clickable    
     }); 

     $("#engLink").click(function(){ 
      $("#espLink").addClass("nonSelected"); 
      $("#engLink").removeClass("nonSelected"); 
      $("#English").toggle(); 
      $("#Espanol").toggle(); 
      // need to make english link unclickable 
      // and espanol link clickable   
     }); 
    }); 

和HTML:

<a id="engLink">English</a> | <a id="espLink">Español</a> 

任何人都知道如何做到这一点?

回答

2

在点击函数中添加一个测试,看链接是否有'nonSelected'类。如果没有,点击上没有任何反应。

$(document).ready(function(){ 
    $("#Espanol").hide(); 
    $("#espLink").addClass("nonSelected");   
    // Make english link unclickable 
    $("#espLink").click(function(){ 
     if($(this).hasClass('nonSelected')){ 
      $("#engLink").addClass("nonSelected"); 
      $("#espLink").removeClass("nonSelected"); 
      $("#English").toggle(); 
      $("#Espanol").toggle();  
      // need to make espanol link unclickable 
      // and english link clickable  
     }else{ 
      return false; 
     }   
    }); 

    $("#engLink").click(function(){ 
     if($(this).hasClass('nonSelected')){ 
      $("#espLink").addClass("nonSelected"); 
      $("#engLink").removeClass("nonSelected"); 
      $("#English").toggle(); 
      $("#Espanol").toggle(); 
      // need to make english link unclickable 
      // and espanol link clickable 
     }else{ 
      return false; 
     }     
    }); 
}); 
+0

谢谢。非常感激。 – plntxt

1
$("#espLink").click(function() 
{ 
    if ($(this).data('clicked')) { 
     return false; 
    } 
    $(this).data('clicked', 1); 
});