如何使这个jQuery代码段在Internet Explorer中工作?

Nat*_*man 3 jquery internet-explorer drop-down-menu

如果有时间讨厌IE,就是这样.此代码以带有内容的框开头.单击该按钮时,该框应该下拉并淡入.

<html>
<script type="text/javascript" src="jquery.js"></script>
<script type='text/javascript'>

function Test()
{
  var item_height = $('#test').height();
  $('#test').height(0);
  $('#test').css('opacity','0');

  $('#test').animate({ height: item_height, opacity: '1' },400);
}

</script>
<body>
<!-- The div below holds the sample content -->
<div id="test" style='border: 1px solid black;'>
  Content<br>
  Content<br>
  Content<br>
  Content<br>
  Content
</div>
<!-- The button to test the animation -->
<br><br>
<div style='position: absolute; top: 150px; left: 10px;'>
  <button onclick='Test();'>Test</button>
</div>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)

这个非常简单的示例适用于Chrome,Safari和Opera.但Internet Explorer?.

我怎么能(如果它甚至可能)修复它,以便它在IE中工作?

Yis*_*oel 5

因为您缺少<head>标记和doctype声明,所以您的页面将以Quirks模式呈现.改变这个

<html>
Run Code Online (Sandbox Code Playgroud)

对此

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  <head>
Run Code Online (Sandbox Code Playgroud)