当页面上已经禁用链接

问题描述：

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

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

TYIA！

你是否手工编码这些链接？我想你会使用'link_to'。在这种情况下，你可以使用'link_to_unless_current'来做你想做的事情。 – jvillian

答

您可以使用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>

我会试试。谢谢你的推荐:) – Aurb

关于第二条if语句，真的是“（/ name）”还是“（/ comments？）” – Aurb

ahh。其“/评论”我的不好 –

答

使用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

答

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

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，这将不会对点击事件的链接

即可。

答

看完你的问题后，我认为对于你的解决方案最简单的答案，而只使用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>

希望这有助于一点。

当页面上已经禁用链接

相关推荐