So deaktivieren Sie einen Paginierungslink vollständig

Question

Wenn ich auf den deaktivierten Link klicke, wird der Anfang der Seite angezeigt. Was ich dafür mache passiert nicht? Ich habe es mit einem JavaScript-Code versucht und es hat nicht funktioniert und das CSS hat auch nicht funktioniert. traurig über mein Englisch

.pagination ul { 
 
    display: inline-block; 
 
    padding: 0; 
 
    margin: 0; 
 
} 
 

 
.pagination li { 
 
    display: inline; 
 
} 
 

 
.pagination li a { 
 
    color: black; 
 
    float: left; 
 
    padding: 8px 16px; 
 
    text-decoration: none; 
 
} 
 

 
.pagination li.active a { 
 
    background-color: red; 
 
    color: white; 
 
} 
 

 
.pagination li:hover.active a { 
 
    background-color: red; 
 
} 
 

 
.pagination li:hover:not(.active) a { 
 
    background-color: #ddd; 
 
    color: black; 
 
} 
 

 
&.disabled, 
 
&[disabled] { 
 
    cursor: not-allowed; 
 
    pointer-events: none; // Future-proof disabling of clicks 
 
    .opacity(.65); 
 
    .box-shadow(none); 
 
}

<div class="container text-center"> 
 
    <ul class="pagination"> 
 
    <li class="disabled"><a href="">«</a></li> 
 
\t <li class="active"><a href="index.html">1</a></li> 
 
    <li><a href="videos2.html">2</a></li> 
 
    <li><a href="videos2.html">»</a></li> 
 
    </ul> 
 
</div>

Answer 1

<ul class="pagination disabled"> // Add the disabled class to pagination 

Wenn Sie deaktiviert Klasse auf den Anker-Tag deaktivieren möchten einen bestimmten Link dann für die Sie deaktivieren möchten hinzufügen.

<a href="index.html" class="disabled"></a> 

und ändern & .disabled nur .disabled in css

Answer 2

Sie class="disabled" in Ihrem a Tag wie so verwenden können:

HTML

<ul class="pagination"> 
    <li><a class="disabled" href="">«</a></li> 
    <li class="active"><a href="index.html">1</a></li> 
    <li><a href="videos2.html">2</a></li> 
    <li><a href="videos2.html">»</a></li> 
</ul> 

CSS

.disabled { 
    pointer-events: none; 
}