3

CSScalc属性をサポートしないブラウザをサポートするように設計されたjQueryで関数を作成しようとしています。

私はこれまでに次のものを持っています：

function calc($element, $xy, $logic, $difference) {
    var calc = $($object).$xy() $logic $difference;
    return calc;
}

if ($.browser.msie && $.browser.version <= 8) {
    var height = calc("body", "height", "-", "80");
    $("div#page").css("height", height);
}

今回は機能がなくても逃げることができますが、今後の参考のために、この機能があれば本当に便利だと思います。

明らかにこの行：

var calc = $($object).$xy() $logic $difference;

...失敗しますが、変数を適切に渡す方法がわかりません。

誰かが構文について、または私がこの行をどのように書くべきかについて何かアドバイスがあれば、それは素晴らしいことです。

4

1 に答える 1

7

あなたはこのようなことをすることができます：

function calc( selector, method, adjust ) {
    return $(selector)[method]() + adjust;
}

if( $.browser.msie  &&  $.browser.version <= 8 ) {
    var height = calc( 'body', 'height', -80 );
    $('div#page').css( 'height', height );
}

そのコードに関するいくつかの注意：

  • $関数パラメーターにプレフィックスは必要ありません。jQueryコードを記述している場合は$、jQueryオブジェクトへの参照である変数にのみプレフィックスを使用することをお勧めします。

    var $foo = $('#foo');  // cache jQuery object for later use

  • -で使用される角括弧に注意してください。これにより[method]、名前が変数に格納されているメソッドを呼び出すことができます。

  • 数学演算と値を1つのadjustパラメーターに結合しました。もっと凝ったことをすることもできますが、このコードが最初にどのように使用されるかについて、より多くの例を見るとよいでしょう。

そして提案：CSS calcをサポートしていないブラウザーでサイジングを行うためにJavaScriptを作成する必要がある場合は、すべてのブラウザーでJavaScriptコードを使用しないのはなぜですか？次に、デバッグするコード/スタイルのセットアップは2つではなく1つだけです。

于 2013-03-26T09:00:57.780 に答える