Internet Explorer 8 Beta 版出来之后，就在网上看到有关IE8兼容性不好之说。今天客户说之前转过来的项目在IE8菜单全部乱了，上去看到果然如此。
该网页现将是在IE8浏览器下浮动的DIV层全部向下列举出来，应该是嵌套ul,li,div,a后或者是ul,li的相对位置和绝对位置冲突而出现的问题，不管是什么原因造成的，总之就是这个网页完全乱了，而在IE7和IE6下面都是正常的。IE系列的浏览器真是够烦的，但愿希望IE9能够真正的支持WEB标准，不再独创一家。
然后就开始找解决方法。先在网页头部加上单独解析IE8的CSS链接：
<!–[if IE 8]>
<link rel=”stylesheet” type=”text/css” href=”ie8hacks.css” />
1 、JS弹出窗口信息和返回。
<script type=’text/javascript’> alert(’Name is empty!’);history.back(0);</script>
2、子窗口传递数据回父窗口。
onClick=”javascript:opener.document.pro.Cata.value=document.pro.Cata.options[selectedIndex].(text|value);”
3、隐藏和显示层的JS脚本。
<script type=’text/javascript’>
<!–//
function showhide(divid){
var obj = document.getElementById(divid);
var shstyle = obj.style.display;
if(shstyle == "block"){
obj.style.display = "none";
}else{
obj.style.display = "block";
}
}
//–>
</script>
Example: Visit Rossy’s blog
5、放大缩小和自适应多行文本框。
More 4)document.com.Profile.rows-=4;else return false’>Less
<textarea name="Profile" cols="80" rows="4" id="Profile">ybfqlyq & Rossy </textarea>
自适应：<textarea onpropertychange="this.style.posHeight=this.scrollHeight">
6、返回上一页，关闭窗口，跳转页面。
返回：history.back(0);
关闭：window.close();
跳转：window.location.href=”http://blog.ybfq.com”;
7、不允许包含框架窗口和必须在框架内操作。
不允许：<SCRIPT LANGUAGE=JAVASCRIPT><!–//
if (top.location != self.location)top.location=self.location;
// –></SCRIPT>
必须：<script>
if (top == self)top.location.href = "index.htm";
</script>
8、页面加载使控件自动获取焦点。
<body onload="javascript:document.login.username.focus();">
9、增加表单元素的JS脚本。
function addFile()
{
var str = ‘<INPUT type="file" NAME="uploadinput[]" size="70">’ document.getElementById("inputCell").insertAdjacentHTML("beforeEnd",str)
}
function removeFile()
{
if (document.getElementById("inputCell").lastChild == null)
{ alert("没得删了！")
} else {
document.getElementById("inputCell").lastChild.removeNode();
}
}
</script>
More less <div id="inputCell"></div>
10、从数据库读取数据的二级联动菜单。
<script language = "JavaScript">
var onecount;
onecount=0;
subcat = new Array();
<?
$sqlc = "select * from $Table";
$result = mysql_db_query($Database_Name,$sqlc);
$count = 0;
while($res = mysql_fetch_array($result)){
?>
subcat[<?=$count?>] = new Array("<?=$res['Id']?>","<?=$res['Class']?>","<?=$res['Catalog']?>");
<?
$count++;
}
echo "onecount=$count;";
?>
//联动函数
function changelocation(locationid)
{
document.pro.Class.length = 0;
var locationid=locationid;
var i;
for (i=0;i < onecount; i++)
{
if (subcat[i][2] == locationid)
{
document.pro.Class.options[document.pro.Class.length] = new Option(subcat[i][1], subcat[i][0]);
}
}
}
</script>
11、全部选择多选框。
<script language="javascript" type="text/javascript">
<!–//
function checkAll(e, itemName)
{
var aa = document.getElementsByName(itemName);
for (var i=0; i<aa.length; i++)
aa[i].checked = e.checked;
checkSub();
}//–>
</script>
<input type="checkbox" name="chk2" value="checkbox" onclick="checkAll(this, ‘Level[]‘)" />
12、替换控件内容。
<script type="text/javascript">
<!–//
function changeImage(bigImage)
{
document.getElementById("bid").innerHTML="<img src=’"+bigImage+"’ >";
}
// –>
</script>
可替换属性innerHTML,outerHTML,innerText,outerText:
innerHTML 设置或获取位于对象起始和结束标签内的 HTML
outerHTML 设置或获取对象及其内容的 HTML 形式
innerText 设置或获取位于对象起始和结束标签内的文本
outerText 设置(包括标签)或获取(不包括标签)对象的文本
13、获取客户端数据。
取得分辨率<script>document.write("宽为"+screen.Width+"高为"+screen.Height)</script>
取得地址栏URL <script>document.write(self.location)</script>
取得地址栏?后参数<SCRIPT>var add = top.location;
add = add.toString();
document.write (add.substring(add.indexOf("?"+1,add.length));
</SCRIPT>
14、图片加载自动缩小的JS脚本。
<script language="javascript">
var flag=false;
function DrawImage(ImgD){
var image=new Image();
image.src=ImgD.src;
if(image.width>0 && image.height>0){
flag=true;
if(image.width/image.height>=290/240){
if(image.width>290){
ImgD.width=290;
ImgD.height=(image.height*290)/image.width;
}else{
ImgD.width=image.width;
ImgD.height=image.height;
}
}
else{
if(image.height>280){
ImgD.height=280;
ImgD.width=(image.width*280)/image.height;
}else{
ImgD.width=image.width;
ImgD.height=image.height;
}
}
}
}
</script>
<img src=”ybfq.gif” onload ="javascript:DrawImage(this)">
14、表单提交后进行JS验证空值，EMAIL，数字。
<script language = "JavaScript" type="text/javascript">
<!– Hide script from older browsers
function chkform( )
{
if (document.all.sform.skey.value=="")
{
//alert("Please write the keyword");
tipss.innerHTML="<font color=red size=3>請輸入關鍵字</font>";
return false;
}
}
//check email
function isValidEmail(str) {
var re=new RegExp("^[_a-z0-9-]+(\.[_a-z0-9-]+)*@[a-z0-9-]+(\.[a-z0-9-]+)*(\.[a-z]{2,3})$","gi")
if (str.match(re)) return true;
else return false;
}
function isEmail (email) {
var rStr = new RegExp("[^a-z,0-9,_,--,@,\.]", "ig"); if((!email.match(rStr))&&email.length>5&&email.indexOf(’@')>0&&email.indexOf(’.')>0)
return true;
else
return false;
}
// check the input date is number
function isDigit(str) {
if (str.search(/[^0-9]/g)==-1) return true;
else return false;
}
//check the input is null
function isNull(str) {
if (str == null || str == "") return true;
else return false;
}
// –>
</script>
<form id="sform" name="sform" method="post" action="result.php" onsubmit="javascript:return chkform( )">
15、加入收藏夹JS脚本。
function addToFavorites(urlAddress,pageName
)
{
if (window.external)
{
window.external.AddFavorite(urlAddress,pageName)
} else {
alert("Sorry! Your browser doesn’t support this function.");
}
}
16、广告代码最后加载。
广告内容加载中…此行放于网页中。
下载较慢的广告代码
<script language = "JavaScript" type="text/javascript">document.getElementById(‘ad_area).innerHTML=document.getElementById(‘ad_content’).innerHTML;
Document.getElementById(‘ad_content’).innerHTML=””;
</script>