Javascript: Làm thế nào để ẩn(disable) một liên kết(link)?

Trong việc lập trình đặc biệt về các trang web có phân quyền, anh trang quản trị bạn sẽ cần ẩn hoặc disable một số lý theo quyền user của người dùng, bài viết này xin hướng dẫn một cách đơn giản để disable một link khi bạn không muốn người user thao tác trên link đó nữa.

HTML
<a id="a1" href="http://vnlives.net">vnlives.net</a> |
<a id="a2" href="http://www.google.com">Google</a>

JAVASCRIPT
$('#a1').attr('disabled', 'disabled').css("color","#ccc");

$('a').live('click', function(e) {
    if ($(this).attr('disabled') == 'disabled') {
        e.preventDefault();
    }
});

DEMO


Như bạn thấy trong demo ở trên khi bạn click vào liên kết VN-Lives nó sẽ không chuyển sang trang khác, đó là nhờ vào phương thức preventDefault() đã ngăn chặn hành động mặc định của đối tương a là chuyển sang một trang khác hay một phần khác của trang, và kết hợp với một chút CSS là ta có ngay hiệu ứng DISABLE LINK.




No comments:

Post a Comment