1

我有一段代码在窗口调整大小时运行。我正在拉输入文本元素的widthouterWidth

这个过程在每个浏览器中都可以正常工作,除了 Webkit,它返回正确的结果 from outerWidth,但结果 from永远不会改变加载时的原始结果。width

这是调整浏览器窗口大小时我的脚本的实际控制台输出(这是 Chrome,但在 Safari 4 中也是如此):

outerWidth: 772
width: 772
outerWidth: 773
width: 772
outerWidth: 773
width: 772
outerWidth: 794
width: 772
outerWidth: 794
width: 772
outerWidth: 815
width: 772
outerWidth: 815
width: 772
outerWidth: 820
width: 772
outerWidth: 837
width: 772

有谁之前经历过这个吗?你知道为什么会这样吗?最重要的是,您知道如何解决它吗?:)

谢谢你。

4

1 回答 1

0

这是我的测试用例。两者似乎都按预期工作(Safari 4)。

<html>
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
  <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
  <style type="text/css">
    input {
      width: 50%;
      height: 2em;
      font-size: 1em;
    }
  </style>
</head>
<body>
  <p>
    <input type="text" id="w" />
  </p>
  <p>
    <input type="text" id="ow" />
  </p>
  <script type="text/javascript">
    function init(){
      $('#w').val($('#w').width());
      $('#ow').val($('#ow').outerWidth());
    }
    $(function(){
      init();

      $(window).resize(function(){
        init();
      });
    });
  </script>
</body>
</html>
于 2009-08-02T17:04:48.147 回答