3

長さを表す文字列値をインクリメントするものが必要です (css マージン)

現在の解決策は次のとおりです。

function incPx(a,b){
     return parseInt(a) + parseInt(b) +'px';
}
incPx($(el).css('margin-left'), '10px')

しかし、おそらくそのためのjQueryがあるかもしれませんか？「px」という他の単位と連携する

4

4 に答える 4

6

jQuery 1.6 以降では、またはで.css()示される相対量を に渡すことができます。+=-=.animate()

$(el).css('margin-left', '+=10px');
于 2012-08-17T17:07:17.553 に答える
1

jQuery 1.6 以降、.css()と同様の相対値を受け入れます.animate()。相対値は、+= または -= で始まる文字列で、現在の値を増分または減分します。たとえば、要素の padding-left が 10px の場合.css( "padding-left", "+=15" )、合計 padding-left は 25px になります。

ソース: http://api.jquery.com/css/

于 2012-08-17T17:08:28.880 に答える
1

ここで「jQueryの方法」について議論している他の回答は完全に有効です。ただし、OPが使用しているものと同様のアプローチを使用するメソッドを含めたいと思いました。これは、「バニラ」javascriptでも使用できます。

OPのコードはそのままで問題なく動作することに注意してください。これは基本的に同じことですが、デフォルトを与えることにもう少し注意が払われています

function incPx (val, amt) {
    var nv = parseInt(val.replace(/[^0-9]/, ''), 10);
    return (
        (nv ? nv : 0) + (amt || 1)
    )+'px';
};

console.log(incPx('10px')); // 11px
console.log(incPx('let us hasten to the zoo, post haste!')); // 1px
console.log(incPx('10px', 10)); // 20px
console.log(incPx('10px', -2)); // 8px

試してみてください: http://jsfiddle.net/jxU6Q/2/

ドキュメンテーション

于 2012-08-17T17:14:13.207 に答える
1

他の人はすでに の相対値を提案していますが、次のように文字列を に変換するためにjQuery.css()簡単に使用できることに注意してください。parseInt50pxNumber

console.log(parseInt('50px', 10));
// 50

function incPx(a, b){
    a = parseInt(a, 10) || 0;
    b = parseInt(b, 10) || 0;
    return (a + b) +'px';
}​

radixただし、10の a を渡すことを忘れないでください。その他の例:例: parseInt (MDN) の使用

于 2012-08-17T17:14:52.520 に答える