3

これは、angular.js の作業中に遭遇した jqLit​​e の問題のようです。問題を確認するには、コンソール タブを開き、この jsbinの [run with js] をクリックします。 left.css("width")すべきではないときに空の文字列を返しています。

HTML

<!doctype html>
<html ng-app>
  <head>
<meta name="description" content="Angular Template" />
    <script src="http://code.angularjs.org/1.0.6/angular.min.js"></script>
    <script src="script.js"></script>
  </head>
  <body>
    <div class="container">
      <div class="left"><span id="test">left</span></div>
      <div class="right">right</div>
    </div>
  </body>
</html>

CSS

.container {display:table; width:100%;}
.left {border: 1px dashed purple; display:table-cell; overflow:hidden; width: 66%; height: 20px;}
.right {display:table-cell; background:green;  width: 34%; height: 20px;}

JS

var innerSpan = document.getElementById("test");
var left = angular.element(innerSpan);
console.log(left.css("width"));

Chrome 開発ツール パネルを使用して要素を調べると、計算された幅は空の文字列ではありませんか? ここで何が欠けていますか？

4

1 に答える 1

14

.css('width')を使用して要素の幅を取得することはできません。スタイル付きの幅を取得するために使用します。要素のスタイル属性で幅を定義していないため、値はありません。

.prop('offsetWidth')代わりに試してください。

また、jsbin.com を使用すると、スクリプトが自動的に含まれます。script.js をインクルードすると、404 がスローされます。

于 2013-05-17T19:36:55.523 に答える