2015-10-09 12 views
6

jestem coraz problem w mojej aplikacji, gdzie chcę wyłączyć html kotwicę z css, widziałem rozwiązanie w Disable link using css, która pracuje bez zarzutu w Chrome i Firefox, ale kiedy otwieram moja strona do Internet Explorer, Nie może być wyłączenie, przeszedłem wiele linków, ale nie dostałem żadnego rozwiązania dla Internet Explorer, Proszę mi pomóc, jeśli masz jakieś pomocne łącze lub odpowiedź. Dzięki z góryWyłącz kotwica html w programie Internet Explorer

http://jsfiddle.net/7EQJp/

<a href="link.html" class="active">Link</a> 

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

Odpowiedz

6

Możesz użyć właściwości cps wskaźnik-zdarzenia, aby wyłączyć linki, ale mają znane problemy z np. Począwszy od np. 11 ta właściwość jest obsługiwana. Jest trochę hack. Powinieneś dodać wyłączoną klasę do linków i dodać wyłączony atrybut do linku, a następnie dodać css podany poniżej. Musisz również podać wskaźnik-zdarzenia, które nie są dostępne dla wyłączonego atrybutu zakotwiczenia. Po tych dwóch powinno to działać w większości przeglądarek.

a.disabled { 
    pointer-events: none; 
} 

a[disabled] { 
    pointer-events: none; 
} 

Zobacz tę fiddle.

+0

Tak Ta sztuczka działa poprawnie w IE. Dzięki @Rahul za odpowiedź –

2

CSS sposób wyłączyć linki:

a[disabled]{ 
pointer-events: none;} 

jeszcze można użyć javascript, aby wyłączyć linki:

$("td > a").attr("disabled", "disabled"); 
2

wydarzenia Pointer był pierwotnie tylko Mozilla . Został przyjęty w -webkit-, ale niestety nie w IE. A teraz mają Edge. Myślę, że tak nigdy nie będzie.

Od docs MDN:

Ostrzeżenie: Zastosowanie wskaźnika-wydarzeń w CSS dla elementów innych niż SVG jest eksperymentalna. Ta funkcja była częścią specyfikacji projektu interfejsu użytkownika CSS3, ale z powodu wielu otwartych problemów została przełożona na CSS4.

+0

to znaczy bez użycia JavaScript nie możemy wyłączyć link w IE @Jay –

1

Mam również do czynienia z tego typu problemem. ale używam tego rozwiązania w moim kodzie i jego działaniu.

.disableButton { 
    background: #e6eeee none repeat scroll 0 0; 
    border: 2px solid #cdcdcd; 
    border-radius: 20px/40px; 
    color: #dcd7dc; 
    cursor: pointer; 
    font-family: arial; 
    font-size: 11px; 
    font-weight: bold; 
    image-rendering: inherit; 
    padding: 5px 30px; 
    pointer-events: none; 
    text-decoration: none; 
    display : inline-block; 
    } 
Powiązane problemy