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 ได้

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

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