当页面上已经禁用链接

Question

我有一个列表（ul），当你点击你将被重定向到另一个页面时，我想要做的就是禁用可点击链接，当你已经在那个页面上时，它突出显示。

<div class="selection"> 
<ul> 
    <li><a href="name">Name</a></li> 
    <li><a href="comments">Comments</a></li> 
</ul> 

TYIA！

Answer 1

您可以使用current_page?

<ul> 
    <% if current_page?('/name') %> 
    <li><strong>Name</strong></li> 
    <% else %> 
    <li><a href="name">Name</a></li> 
    <% end %> 
    <% if current_page?('/comments') %> 
    <li><strong>Comments</strong></li> 
    <% else %> 
    <li><a href="comments">Comments</a></li> 
    <% end %> 
</ul> 

Answer 2

使用jQuery的

HTML部分

<div class="selection"> 
<ul id="menu"> 
    <li><a href="name">Name</a></li> 
    <li><a href="comments">Comments</a></li> 
</ul> 

jQuery的

$(document).ready(function() { 
      $("#menu a").each(function(){ 
       //set all menu items to 'black 
       $(this).css("color","black"); 

       var linkPath=$(this).attr("href"); 
       var relativePath=window.location.pathname.replace('http://'+window.location.hostname,''); 

       //set the <a> with the same path as the current address to blue 
       if(linkPath==relativePath) 
        $(this).css("color","blue"); 
      }); 
    }); 

enter link description here

Answer 3

您可以尝试使用助手，以便您可以在其他部分使用此功能，因为您需要。

def active_link(text, path) 
    class_name = current_page?(path) ? 'active' : nil 
    link_to text, path, :class => class_name 
end 

这将打印与类活动的一个链接，如果该链接是一样的当前页面

active_link 'home', root_path 

现在你可以用CSS结合这使您可以在链接时禁用点击这有活动类

a.active { 
    pointer-events: none; 
    cursor: default; 
} 

这一切，你与助手打印将活动类，并与CSS，这将不会对点击事件的链接

即可。

Answer 4

看完你的问题后，我认为对于你的解决方案最简单的答案，而只使用HTML可能是摆脱源页面上的<a>...</a>标签，以便当你在那里时，文本将显示，但是不可链接。至于在该页面上突出显示文字，请使用<mark>...</mark>作为<li>...</li>的子元素。

一个例子，假设 “name” 是在活动页面：

<div class="selection"> 
    <ul> 
     <li><mark>Name</mark></li> 
     <li><a href="comments">Comments</a></li> 
    </ul> 
</div> 

希望这有助于一点。