javascript - 幅の検出：jQueryの自動

Question

私はjQueryを使用して要素の幅を取得していますが、明示的な幅（および高さ）が指定されているかどうかを示すことができれば、それを好むでしょう。

<div id="test"></div>
<script type="text/javascript">
$(function() { alert($('#test').css('width')); });
</script>

これにより、クライアントの画面で占めるピクセル数に関して、divの暗黙の幅が警告されます。幅が欠落しているか、width: autojQueryを使用して検証できるように設定されている場合、方法はありますか？

つまり、上記の例では整数を返す代わりに、またはのいずれautoかを返しますundefined。または、代わりに、isAuto関数に相当するものはありますか？

score 10 · Accepted Answer

これにより、絶対値で文字列「auto」または「180px」が取得されます。

$('element').prop('style').width

幅または

$('element').prop('style').height

高さのために。

score 9 · Accepted Answer

現時点では不可能だと思います。少なくとも IE 以外のブラウザではそうではありません。IEelement.currentStyleは、CSS ファイルに記述された時点でスタイルを表す実装を行います。一方、残りのブラウザは、これらのスタイルの計算値window.getComputedStyleを返す実装を実装しています。auto の代わりに数値が表示されます。

これを回避する唯一の方法は、から CSS 宣言を解析することdocument.styleSheetsです。

参考文献:

score 4 · Accepted Answer

~~$('#test')[0].style.width=="auto"動作するはずです： http： //jsfiddle.net/KxTLE/およびhttp://jsfiddle.net/KxTLE/1/~~ 試してください

jQuery.fn.isAuto=function() {
if(this[0]) {
    var ele=$(this[0]);
    if(this[0].style.width=='auto' || ele.outerWidth()==ele.parent().width()) {
        return true;
    } else {
        return false;
    }
}
return undefined;
};

そして例： http： //jsfiddle.net/KxTLE/6/

score 3 · Accepted Answer

私の知る限り、自動幅または高さを検出するネイティブの jQuery 関数はありません。だから私はそれを行うためのプラグインを書きました。

$.fn.isAuto = function(dimension){
    if (dimension == 'width'){
        var originalWidth = this.innerWidth();
        var marginLeft = parseInt(this.css('margin-left'));
        var testMarginWidth = marginLeft+50;
        this.css('margin-left', testMarginWidth);
        var newWidth = this.innerWidth();
        this.css('margin-left', marginLeft);
        if(newWidth<originalWidth){
            return true;    
        }
        else{
            return false;
        }
    }
    else if(dimension == 'height'){
        var originalHeight = this.height();
        this.append('<div id="test"></div>');
        var testHeight = originalHeight+500;
        $('#test').css({height: testHeight});
        var newHeight = this.height();
        $('#test').remove();
        if(newHeight>originalHeight){
            return true;    
        }
        else{
            return false;
        }
    }
};

元々、高さを行うために書いていたので、幅を含めるように拡張しました。次のように呼び出すだけです。

$('#element').isAuto('width');

また

$('#element').isAuto('height');

これは、プラグインの機能を示すフィドルです。

score 0 · Accepted Answer

あなたの質問に正しく答えているかどうかはよくわかりませんが、width() 関数を使用すると、レンダリングされた幅をピクセル単位で表す整数が得られます。

score 0 · Accepted Answer

関数を作成する
css 要素 ID を関数に渡す
要素 id の width プロパティに対して実行するステートメントを case where に記述します

注：複数の要素で使用するには、要素名の配列でループを使用するのが賢明です

javascript - 幅の検出：jQueryの自動

6 に答える 6

Related

Reference