单击链接后无法点击链接 – 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：

 English | Español 

有人知道怎么做吗？

Answer 1

在click函数中添加一个测试，以查看该链接是否具有正确的“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; } }); }); 

Answer 2

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