location.href không làm việc trên IE6!

trong danh mục Javascript

ie-suck-banner

Vừa mới giải quyết xong một vấn đề tưởng chừng như đơn giản trong javascript nhưng cực kỳ đáng ghét đối với thằng IE6 – đó là chức năng redirect sử dụng location.href.

Có lẽ các bạn làm javascript cũng biết là nhu cầu redirect cũng thường gặp. Vd như chức năng liên kết website chẳng hạn, sử dụng 1 cái select box, người chọn chọn website nào thì sẽ chuyển sang website đó.

location.href-not-working-IE6

Mình lượt bỏ các phần lập trình, mình chỉ nói tới phần cốt lõi của vấn đề. VD: bạn nhấn nút ‘Chuyển’ thì website sẽ redirect.
Nội dung thẻ A của cái hình ‘Chuyển’:

 <a href="javascript:void(0)" onclick="redirectMe();"><img src=".." /></a>

Trong javascript bạn sẽ triển khai hàm redirectMe() như sau:

<script type="text/javascript">
function redirectMe()
{
        //giả sử sau khi xử lý select box, bạn lấy được URL sẽ chuyển tới, 
        //ở đây mình fix để đơn giản DEMO
        var url = 'http://bloghoctap.com';
        document.location.href = url;
}
</script>

Cái cốt lõi của chức năng này chỉ là cái chỗ gán URL, document.location.href, ngoài ra bạn cũng có thể sử dụng 1 số cách gán khác, vd: window.location, window.location.href… Cái này thì đa số sách nào cũng chỉ, nên nó sẽ chạy thôi. Script này chạy trên hầu hết trình duyệt, ngoại trừ thằng IE6 cùi bắp , mà IE6 cũng vẫn đang được sử dụng nhiều mới đau T_T.

Vậy giải pháp là gì?
1> Bạn cho hàm redirectMe() return false.

<script type="text/javascript">
function redirectMe()
{
        //giả sử sau khi xử lý select box, bạn lấy được URL sẽ chuyển tới, ở đây mình fix để đơn giản DEMO
        var url = 'http://bloghoctap.com';
        document.location.href = url;
        return false;
}
</script>

2> Sửa lại cái thẻ A như sau:

<a href="javascript:void(0)" onclick="return redirectMe();">...</a>

Hy vọng bài viết này sẽ giúp bạn nào đang gặp vấn đề nan giải tương tự.

2 bình luận

  1. Lẽ ra chỉ cần 1 giải pháp duy nhất là dừng hỗ trợ IE6 kaka.

    [Reply]

  2. Dũng says:

    Cảm ơn rất nhiều nhé, mình đang cần vì bị lỗi đó hì hì.

    [Reply]

Gởi bình luận