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 đó.

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ự.

Bài viết liên quan:

• Tự động chuyển trang – Auto Redirect cho website
• Lấy bản thảo ebook trên Alezaa.com
• Phân loại – phương pháp làm việc khoa học
• Tạo box HTML có góc bo tròn với Curvy Corners