2011-12-14 5 views
1

私のjqueryで遊んでいて、非常に奇妙な問題で立ち往生しています。私は今私は、のはCSS関数を使用したJquery

container_width = block_width * 21; 

をしましょうとcontainer_widthを警告する場合は、今私は数字のNah instedになるだろうという幅で何かをしたいと思い、この

block_width = $(".grid_block").css("width"); 

のようにdiv要素の幅を取得しています私は間違って何をしていますか?

答えて

4

同じことの前のparseIntを行います)メソッドです。.css(width)と.width()の違いは、後者が単位なしのピクセル値(たとえば400)を返し、前者が単位はそのままです(例:400px)。 確認してくださいhttp://api.jquery.com/width/ 他の投稿のように幅を取​​得するために解析する必要はありません。

+1

@Linasこのフィドルを試してみてください。 http://jsfiddle.net/XwayB/3/として更新されました –

5

あなたが受け取る幅値は単位

IEを含む文字列になりますので、あなたがNaN代わりの番号を取得している:あなたparseInt

width = ...css('width'); 
width = parseInt(width); 
と数を解析することができ

"500px" 
"3em" 
"27.2%" 

jQueryにはwidth methodがあるため、これは完全に不要です。

width = ...width(); //numeric value 
0

これはblock_widthがint型のためです。

block_width = intParse($(".grid_block").css("width").replace('px')); 
    container_width = block_width * 21 

またはイベント良好

block_width = $(".grid_block").width(); 
container_width = block_width * 21 
5

.css("width")添付"px"、すなわち"___px"と、幅を表す文字列を返します。その文字列に何らかの数値を掛けると失敗します("12px" * 2NaNと評価されます)。

幅を取得するには.width()、幅を設定するには.width(x)を調べることができます。あなたは数学の操作の一部として文字列を代入している

1

...

はこれを試してみてください:

block_width = parseInt($(".grid_block").css("width")); 
1

あなたのcss(「幅」)は、文字列ではなく数を返します。 parseInt/parseFloatを使用して変換するか、またはjquery .width()関数(数値を返す)を使用します。

+0

もしblock_widthに注意を喚起しようとすれば、数字を得ることができます。 – Linas

+0

'typeof(block_width)'をチェックすることができます。これは、CSSメソッドを照会している場合の文字列です。 –

1

端からピクセルを削除し、私はwidth()あなたはjqueryの幅を使用する必要が

var block_width = $(".grid_block").width(); 
var container_width = block_width * 21; 
alert(container_width) 

Try this Fiddle

1

(で行っている、あなたの乗算

block_width = block_width.replace("px", "") 
container_width = parseInt(block_width) * 21; 
0

Hy、 同じ問題が発生しました。例えば、.css("width")は "20px"を返します。私は確か少し奇妙であり、あなたはおそらく正規表現でこれを解決するが、私がやったことだった可能性があり、やった:私はあなたが新しい変数を初期化することなく、しかし、誰かが望んでいる場合も、1行目ですべてをためにできるわけ

var newWidth = parseInt(($('something').css("width")).split("px")[0])+xx;//xx... Size you want to add 
$('something').css("width",newWidth); 

あなたのコードを読んで、まだjqueryやjavascriptにはない、私はそれを分割する方が良いと思います。 これがあなたを助けてくれることを願っています!

関連する問題