Rumah > hujung hadapan web > html tutorial > 这段代码能在火狐运行,不能在IE8上运行,求解。_html/css_WEB-ITnose

这段代码能在火狐运行,不能在IE8上运行,求解。_html/css_WEB-ITnose

WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWB
Lepaskan: 2016-06-24 11:33:29
asal
1311 orang telah melayarinya

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><title>catalog</title><style type="text/css">  li{list-style:none;}a{color:black;text-decoration:none;}#catalog{      background-color:red;   padding-right:25px;   margin-right:20px;   float:left;}</style><script type="text/javascript">   var myBoolean = new Boolean(true);   function showTree(){      var tree = document.getElementById("tree");      var list = document.getElementById("list");      if(myBoolean == true)      {           tree.value="-";           list.style="display:block;";           myBoolean=false;        }       else      {           tree.value="+";           list.style="display:none;";           myBoolean=true;       }   }</script></head><body><div id="catalog"><ul>  <li><input type="button" value="+" id="tree" onclick="showTree()" />帮助文档:</li>  <ul id="list" style="display:none;" >    <li><a href="http://www.baidu.com" target="content">办公室</a></li>  <li>绘图室</li>  </ul></ul></div><div id="content"><iframe name="content" width="1024" height="768" frameborder="0" ></iframe></div></body></html>
Salin selepas log masuk

求高手看看,是不是兼容性问题,是的话如何修改下代码?跪谢。


回复讨论(解决方案)

if(myBoolean == true)
{
tree.value="-";
list.style.display="block";
myBoolean=false;
}
else
{
tree.value="+";
list.style.display="none";
myBoolean=true;
}
改成下面的就好了


IE8 IE 9 FF 都可以

写那么多,只要一句就可以实现了。。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><title>catalog</title> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <script src="http://libs.baidu.com/jquery/1.11.1/jquery.min.js"></script><style type="text/css">   li{list-style:none;}a{color:black;text-decoration:none;} #catalog{      background-color:red;   padding-right:25px;   margin-right:20px;   float:left;} </style> <script type="text/javascript">	$(function () {		$('#tree').bind('click', function () {			$('#list').toggle();		})	})</script></head><body><div id="catalog"><ul>  <li><input type="button" value="+" id="tree"/>帮助文档:</li>  <ul id="list" style="display:none;" >    <li><a href="http://www.baidu.com" target="content">办公室</a></li>  <li>绘图室</li>  </ul></ul></div><div id="content"><iframe name="content" width="1024" height="768" frameborder="0" ></iframe></div> </body></html>
Salin selepas log masuk

另外,你的结构是有问题的。ul 里面写ul,那么第二个ul应该在li里面
你的不符合标准。




    • ....





下面改装:
<script type="text/javascript">	$(function () {		var ss = $('#catalog').find('li').not($('#catalog').find('li').eq(0));		ss.hide();		var x = 0;		$('#tree').click(function () {			if(x == 0) {				ss.show();				$('#tree').val('-');				x = 1;			} else {				ss.hide();				$('#tree').val('+');				x = 0;			}		})	})</script></head><body><div id="catalog"><ul>  <li><input type="button" value="+" id="tree"/>帮助文档:</li>  <li><a href="http://www.baidu.com" target="content">办公室</a></li>  <li>绘图室</li></ul></div>
Salin selepas log masuk
Salin selepas log masuk

另外,你的结构是有问题的。ul 里面写ul,那么第二个ul应该在li里面
你的不符合标准。




    • ....





下面改装:
<script type="text/javascript">	$(function () {		var ss = $('#catalog').find('li').not($('#catalog').find('li').eq(0));		ss.hide();		var x = 0;		$('#tree').click(function () {			if(x == 0) {				ss.show();				$('#tree').val('-');				x = 1;			} else {				ss.hide();				$('#tree').val('+');				x = 0;			}		})	})</script></head><body><div id="catalog"><ul>  <li><input type="button" value="+" id="tree"/>帮助文档:</li>  <li><a href="http://www.baidu.com" target="content">办公室</a></li>  <li>绘图室</li></ul></div>
Salin selepas log masuk
Salin selepas log masuk


多谢提醒,我会修正这个结构问题。
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan