jquery: xóa con trỏ trỏ?

Question

Tại sao tôi không thể thay đổi CSS của thẻ a bằng jquery? Ví dụ,

html,

<a href="#">1</a> 
<a href="">2</a> 
<a href="http://website.com/#/home/about/">3</a> 
<a href="http://website.com/home/about/">4</a> 

liên kết 1 và 2 không thể nhấp vì vậy tôi muốn loại bỏ các con trỏ trỏ.

jquery,

$("a").click(function(e){ 
    if($(this).attr("href") == "#" || $(this).attr("href") == "") { 
     alert("this is non-clickable"); 
     $(this).css({cursor:"default"}); 
     e.preventDefault(); 
    } 
    else{ 
     alert($(this).attr("href")); 
     $(this).css({cursor:"pointer"}); 
     e.preventDefault(); 
    } 
}); 

là nó có thể?

jsfiddle

Answer 1

Nếu bạn muốn, bạn có thể dễ dàng làm điều này với CSS

a[href="\#"], a[href=""] { 
    cursor: default; 
} 
/* I've used an element[attr] selector here which will select all a tags 
    with this combination, if you want to target specific a tags, 
    wrap them in an element with a class and you can than refer as 
    .class a[href]... */ 

Demo

Nếu bạn muốn vô hiệu hóa các liên kết, bạn có thể đạt được điều đó quá sử dụng CSS pointer-events: none; thuộc tính

Demo 2 (Sẽ giúp bạn nếu JS bị tắt, điều này sẽ không cảnh báo thư, nhưng nó sẽ giúp bạn vô hiệu hóa sự kiện bạn đang thử ing để làm)

Answer 2

Lỗi của bạn nằm trong css jquery. Bạn cần dấu ngoặc kép quanh css js của bạn sẽ giống như thế này:

$("a").click(function(e){ 
    if($(this).attr("href") == "#" || $(this).attr("href") == "") { 
     alert("this is non-clickable"); 
     $(this).css({'cursor' :"default"}); 
     e.preventDefault(); 
    } 
    else{ 
     alert($(this).attr("href")); 
     $(this).css({'cursor':"pointer"}); 
     e.preventDefault(); 
    } 
}); 

Ngoài ra bạn có thể sử dụng phương pháp addClass sau đó trong css có một phong cách cho không href

Answer 3

cố gắng để thay đổi dòng

dạng

$(this).css({cursor:"default"}); 

để

$(this).css('cursor','default'); 

cho tôi biết nếu bạn gặp phải bất kỳ vấn đề