坑爹的IE8

白馬酒涼發表於2013-06-24

1.不能用trim(),要用$.trim()
   var aa = $("#id").val().trim()  這樣素不行的,要變成這樣Jquery的方式 var aa = $.trim($("#id").val()) 
  還有個迂迴的方式自己來實現
   參照:http://hi.baidu.com/yuiezt/item/756d0f4ec4d2640ec11613f9

2.使用<marquee>,當一輪走過後,總要有一段空白的才會走下一輪。當裡面的內容超過螢幕寬度太多時,這種狀況就更加明顯了。
  
為此,改用每隔一段時間移動位置來實現。
   發現當speed設成1時,IE8變得非常侷促,一下快一下慢,這是為咩啊,我摔,別的IE9,Chrome都飛快地說。
<script>
var speed=100;
var tab=document.getElementById("main");
var tab1=document.getElementById("content1");
var tab2=document.getElementById("content2");
tab2.innerHTML=tab1.innerHTML;
function Marquee(){
if(tab2.offsetWidth-tab.scrollLeft<=0)
tab.scrollLeft=tab.scrollLeft-tab1.offsetWidth*10
else{
tab.scrollLeft=tab.scrollLeft+10;
}
}
var MyMar=setInterval(Marquee,speed);
tab.onmouseover=function() {clearInterval(MyMar)};
tab.onmouseout=function() {MyMar=setInterval(Marquee,speed)};
</script>

  
3.慎用"dispaly:none"/"display:block",採用"visiblity:hidden"/"visibility:show",最好用Jquery的show()和hide()來控制
  "visiblity:hidden"會留出個位置給隱藏元素,這樣當切換元素可見不可見的時候,畫面位置不會改變。
  而"display:none"在其它瀏覽器也沒事,但碰上IE8,就會在頁面上留下個殘影,IE8,你的反應要不要這麼慢阿!

4.當DropDown List子項值的長度超過預留位置時,IE8擋住了過長的部分,不方便選擇

補救方法,在option加上title屬性,使得滑鼠放上面可以顯示整個文字值

test : <select name="Select1" value="0" style="width:250px">
<option selected="true" value="0">Please choose a value</option>
<option value="1" title='aaaaaaaaaaaaaaaaaabbbbbbbbbbbbbbbbbbbaacccccccccccc'>aaaaaaaaaaaaaaaaaabbbbbbbbbbbbbbbbbbbaacccccccccccc</option>
<option value="2" title='aaaaaaaaaabbbbbbbbbbbbbbbbbbbcccccddddddd'>aaaaaaaaaabbbbbbbbbbbbbbbbbbbcccccddddddd</option>
</select>


效果:

 5.Jquery在做Browser support時,動態給地裡面加入些元素測試,結果某些語句通不過
這個是ie的問題,它不支援修改tr或table的innerHTML屬性,只允許修改td的innerHTML,真是奇葩呀
innerHTML未知的執行錯誤
http://www.cnblogs.com/orc/archive/2008/06/18/1224322.html

jquery-1.8.3.js
div = document.createElement("div");

div.innerHTML = "<table><tr><td></td><td>t</td></tr></table>";

jquery.js
div.innerHTML = "<div style='width:4px;'></div>";

div.innerHTML = "<table><tr><td style='padding:0;display:none'></td><td>t</td></tr></table>";

解決辦法,使用低版本的jQuery,比如jquery-1.6.4

相關文章