Apr 5 2010

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

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

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

No related posts.

Related posts brought to you by Yet Another Related Posts Plugin.

By aspgod • Javascript • 3 • Tags: ,