2009-12-02 13 views
37

Có thể tạo liên kết không làm gì cả. Tôi muốn mục là một liên kết để tôi có được con trỏ thay đổi khi di chuột qua, nhưng tôi không muốn liên kết thực sự đi bất cứ đâu vì nó thực sự kích hoạt hiển thị div với chức năng bổ sung trên cùng một trang.Làm cách nào để tạo liên kết không có nơi nào

Trả lời

80

sẽ thêm vào lịch sử trình duyệt:

<a href="#"></a>

Sẽ không thêm vào lịch sử trình duyệt (phương pháp ưa thích):

<a href="javascript:;"></a>

+10

đây có phải là ok ngay cả khi họ đã javascript tắt? – pingu

+3

Có, nó sẽ không làm gì cả. –

+1

Cũng giống như một ghi chú, sau này không gây ra vấn đề nếu bạn có một bộ chức năng onclick. – Shule

1

Một lựa chọn sẽ được trỏ đến # someid - nó sẽ di chuyển nó dọc di chuyển đến yếu tố đó, nhưng đó có thể hay không là những gì bạn muốn.

Ps. bạn có thể đạt được kết quả tương tự với phong cách.

15

Thay vào đó, bạn có thể sử dụng một <span> và thiết lập con trỏ kiểu:

<span id="node42" class="node-link">My Text</span> 

Và chỉ định con trỏ trong stylesheet của bạn:

.node-link { cursor: pointer; } 

này cũng sẽ cho phép bạn để đính kèm vào nút cho hành động của bạn sau (hiển thị ở đây sử dụng Prototype):

<script type="text/javascript"> 
    $('node42').observe('click', function(event) { 
     alert('my click handler'); 
    }); 
</script> 
+3

Tại sao id thay vì lớp học? –

+0

@Roger: sử dụng 'id' cho phép phần tử được xác định duy nhất, chủ yếu là hữu ích cho ví dụ javascript trong trường hợp này. Bạn có một điểm tốt cho con trỏ. Nó có lẽ là một phong cách dựa trên lớp. Tôi đã cập nhật câu trả lời của mình. Cảm ơn! – jheddings

+1

Điều này sẽ không nhập kiểu dáng của siêu liên kết (như màu siêu liên kết, văn bản trang trí ... v.v.). Vì vậy, câu trả lời của powers1 là tốt hơn. – Pratyush

2

Nếu bạn jus t muốn kiểu, đặt CSS cursor property thành con trỏ.

Nhưng có vẻ như bạn muốn <a href="javascript:void(do_something())">.

6

Chỉ cần thêm phong cách cursor:pointer đến yếu tố:

<a id="clickme">Click Me</a> 

CSS:

#clickme { cursor: pointer } 

Hoặc (trời cấm) in-line:

<a style="cursor:pointer">Click Me</a> 
+1

Bạn phải sử dụng href = "#". Click Me sẽ tạo sự cố. –

+0

@Umesh, có vấn đề gì? "Vấn đề" duy nhất là các kiểu di chuột sẽ không hoạt động trong IE6 và con trỏ 'cursor: pointer' sẽ không tự động được áp dụng. Vui lòng giải thích. –

13

theo ý kiến ​​của tôi, giải pháp hoàn toàn miễn phí hack hoàn toàn nhất:

<a href="" onclick="return false;">do absolutely nothing</a> 
+1

Giải pháp này dường như hoạt động tốt nhất cho tôi, cho đến nay, vì tôi muốn sử dụng hàm JavaScript trong 'onclick' (tôi vừa trả về false sau nó): ví dụ: 'my text' – Shule

1

thử này "< a href =" javascript:; ">"

1

tôi đang tìm kiếm một cái gì đó đơn giản hơn, và tôi nghĩ rằng tôi đã tìm thấy nó. Bạn có muốn liên kết của bạn không đi đâu cả? Bỏ qua số href.

<a class='irrelevant_for_this_example'>Some text</a>

href="#" sẽ di chuyển đến phía trên cùng của trang.

href="javascript:;" có vẻ tinh tế.

Một giải pháp JS có vẻ không cần thiết cho một cái gì đó đơn giản.

+2

Thực ra, tôi nghĩ OP có thể sử dụng liên kết để kích hoạt một hộp có thể mở rộng/mở rộng được bằng JavaScript. Tôi có thể xác nhận 'href =" javascript:; "' làm việc cho điều đó. Xóa 'href' có nghĩa là trình duyệt không coi đó là liên kết thông thường, tức là, chuột không thay đổi thành ngón tay khi bạn di chuột qua liên kết. – binaryfunt

+0

Có nói rằng, 'href =" # void "', hoặc một cái gì đó như thế, hoạt động, và có thể tốt hơn – binaryfunt

1

Dưới đây là 2 javascript cổ điển phương pháp tiếp cận mà sẽ không cung cấp cho bạn một lỗi trong bạn JS-console và/hoặc không thay đổi URL cũng lưu nó vào lịch sử trình duyệt của bạn:

<a href="javascript:void(0);">Click on this javaScript error-free link that won't change your URL nor save it into your browser history</a><hr /> 
 
<a href="#void">Maybe a more readable approach, but unfortunately this one changes your URL</a>

Các vấn đề liên quan