我可以使鏈接在CSS中處於非活動狀態嗎？

我有一個事件列表，由於某種原因，列表中第一個事件的名稱顯示爲鏈接。我沒有link_to或a href標籤，沒有別的我能想到的事情會導致事件成爲鏈接......沒有相關的div或樣式。所以，我想通過使使之失去活性，但與代碼我可以使鏈接在CSS中處於非活動狀態嗎？

.inactivate { 
    pointer-events: none; 
    cursor: default; 
}

我的第一個事件的名稱仍然顯示爲活動鏈接我的HTML

<% @events.each do |e| %> 
<div class="wrp"> 
<div class="otw"> 
<div class="edate"> 
<span class="strf"><%= e.created_at.strftime("%b").to_s %></span> 
<span class="strf"><%= e.created_at.strftime("%d").to_s %></span> 
<span class="strf"><%= e.created_at.strftime("%Y").to_s %></span> 
</div> 
<div class="otr"> 
<span class="inactivate"><%= e.name %></span> 
<%= link_to "Tables View", event_path(e)%> 
<%= link_to "Reservations", event_reservations_path(e)%> 
<%= link_to "Guestlist", event_guestlists_path(e)%> 
<%= link_to "Manage Inventory", event_path(e)%> 
<%= link_to "Promote", event_path(e)%><br> 

</div> 
</div> 
</div> 
<% end %>

我來掩蓋一時的問題我正在使用span類「失活」，但我無法使其工作。有什麼建議麼？

生成的HTML是

<div class="otw"> 
    <a href="events/new"> 
     <div class="edate"> 
      <span class="strf">Feb</span> 
      <span class="strf">02</span> 
      <span class="strf">2017</span> 
     </div> 
    </a> 
    <div class="otr"> 
     <a href="events/new"> 
      <span class="non">mjq wednesday</span> 
     </a> 
     <a href="/events/1">Tables View</a> 
     <a href="/events/1/reservations">Reservations</a> 
     <a href="/events/1/guestlists">Guestlist</a> 
     <a href="/events/1">Manage Inventory</a> 
     <a href="/events/1">Promote</a><br> 
    </div> 
</div>

，它顯示了一個a href="events/new"。我有一個標籤是在導航欄的唯一的地方，我有

<div> 
<ul class="uni"> 
    <li class="evn"><a class="active" href="#home">Home</a></li> 
    <li><div class="dropdown"> 
    <button class="dropbtn">Dropdown</button> 
    <div class="dropdown-content"> 
     <% @venus.each do |v| %> 
     <%= link_to v.name, venue_path(v) %> 
     <% end %> 
    </div> 
</li> 
    <li class="uli"><a href="#news">News</a></li> 
    <li class="uli"><a href="#contact">Contact</a></li> 
    <li class="uli"><a href="events/new">Add New Event</li> 
</ul> 
</div>

但兩人都沒有連接呢..？

來源

2017-03-07 MisterCal

您可以將生成的HTML代碼添加到您的問題嗎？這應該有助於搞清楚發生了什麼 –

@Karim，添加了生成的代碼......事件列表上方有一個導航欄，鏈接與導航欄中的一個項目相同......但它有完全不同的類。 – MisterCal

帶有'events/new'鏈接的'a'標籤在幾個地方生成，這真的很奇怪。確保視圖與另一個視圖不衝突，除此之外我不確定可能是什麼問題 –

它看起來像你可能會丟失這條線關閉錨標記：

<li class="uli"><a href="events/new">Add New Event</li>

這可能會導致您的瀏覽器多次使錨標記內它遇到的每個塊元素，直到標記關閉或頁面結束。

來源

2017-03-07 10:34:33 gwcodes

哇，謝謝。不能相信我錯過了那個。 – MisterCal

這應該工作，雖然這是醜陋的解決方案：

.inactivate { 
    pointer-events: none; 
    cursor: default; 
    text-decoration: none; 
    color: /* some common color */ 
} 
.inactivate:hover { 
    pointer-events: none; 
    cursor: default; 
    text-decoration: none; 
    color: /* some common color */ 
} 
.inactivate:active { 
    pointer-events: none; 
    cursor: default; 
    text-decoration: none; 
    color: /* some common color */ 
}

最終，你可以嘗試，如果以上所有代碼行是你真正需要的，也許他們都沒有。

來源

2017-03-07 07:56:47

我可以使鏈接在CSS中處於非活動狀態嗎？

回答

相關問題