ie problem

document.getElementById().style.display = ‘table’ problem with ie

ในเมื่อ ie 6 ยังคงก่อความเดือดร้อนให้กับโลก online อยู่เสมอมา ปัญหาเกี่ยวกับ browser ที่แสดงผลไม่เหมือนกันจึงเกิดขึ้นอย่างต่อเนื่อง นี่เป็นตัวอย่างของปัญหาหนึ่งใน javascript ที่เปลี่ยน style ให้เป็น table

ปกติแล้วถ้าให้ style=”display : table” จะไม่มีปัญหาในการแสดงผล ไม่ว่าจะเป็น browser ใดก็ตาม แต่หากว่าเราเปลี่ยนการแสดงผลของ style ไปเป็น javascript ดังนี้

document.getElementById('table1').style.display = 'table'

ปัญหาที่ตามมาคือ ie 6,7 จะไม่แสดงผลตามที่ javascript สั่งการ ถ้าเปิดด้วยโปรแกรม ietester ก็จะพบ error ในจังหวะที่ javascript นี้ถูกเรียกใช้

วิธีการแก้ปัญหา
1. ต้องแยกก่อนว่า browser ที่ใช้แสดงผลนั้นเป็น browser ชนิดใด Identify Browser
2. ถ้าเป็น ie browser ก็ให้เราเปลี่ยน

document.getElementById('table1').style.display = 'table'

เป็น

document.getElementById('table1').style.display = 'block'

เพราะ ie 6,7 ไม่สามารถแสดงผลจำพวก table, table-row อะไรได้เลย (ในกรณีของ javascript) ซึ่ง table กับ block มีการแสดงผลเหมือนกัน
แต่ถ้าเป็นกรณีของ firefox หรืออื่น ให้แสดงผลเป็น table ได้

ทำตามนี้ก็สามารถแก้ปัญหาการแสดงผลประเภทนี้ได้

หวังเป็นอย่างยิ่งว่าข้อมูลนี้จะเป็นประโยชน์นะครับ

Identify Browser using JavaScript (IE problem)

จะทำอย่างไรเมื่อ ie 6 แสดงผลต่างกับ browser อื่นๆเป็นอย่างมาก จะเลิกใช้ก็ไม่ได้ เพราะ user ie 6 ยังค่อนข้างเยอะอยู่ ถ้ามีปัญหาในกรณีนี้บางครั้งต้องหลีกเลี่ยงด้วยการใช้ javascript ในการแบ่งแยกว่านี่เป็น browser อะไร ตามตัวอย่างนี้เลยครับ

1
2
3
4
5
6
7
8
9
10
11
12
13
14
var ua = navigator.userAgent.toLowerCase();
if ( ua.indexOf( "opera" ) != -1 ) {
    browserName = "opera";
} else if ( ua.indexOf( "msie" ) != -1 ) {
    browserName = "msie";
} else if ( ua.indexOf( "safari" ) != -1 ) {
    browserName = "safari";
} else if ( ua.indexOf( "mozilla" ) != -1 ) {
    if ( ua.indexOf( "firefox" ) != -1 ) {
        browserName = "firefox";
    } else {
        browserName = "mozilla";
    }
}

หลังจากนี้ก็ต้องไปแบ่งแยกกันละว่า จะให้ browser อะไรแสดงผลแบบไหน

หวังเป็นอย่างยิ่งว่าข้อมูลนี่จะเป็นประโยชน์นะครับ

ขอบคุณ
quomon.com