8

私はこのようなコードを持っています、これはサンプルコードです、

<style>
    .divStyle
    {
        border: 2px solid gray;
    }
</style>
<script>
    $(document).ready(function () {
        var div = $("<div class='divStyle'></div>");
        var border = div.css("border");
    });
</script>

ボーダーは空の文字列を返します。境界値を取得する方法は?

4

3 に答える 3

3

に挿入せずに完了することはできませんDOMが、ここに私が考えることができるトリックがあります。これは、非表示としてdomに挿入し、cssプロパティを取得して削除することです。

$(document).ready(function () {
    var div = $("<div class='divStyle'></div>").css('display','none').appendTo('body');
    var border = div.css('border');
    div.remove();
    alert(border);
});

デモ

于 2012-09-28T10:44:44.623 に答える
1

クラスを使用して非表示の入力を挿入し、css プロパティを取得して使用することができます。

<input id="getPadding" class="inp" type="text" style="display:none" />

次に、要素が追加された後、要素の親の幅を取得し、入力をその幅からパディングの量を差し引いた値に設定できます..そのように

 $('td input').width($(this).parent().width() - [$('#getPadding').css('padding-left') + $('#getPadding').css('padding-right')])

または、css のみのソリューションがありますが、IE7 以下では機能しません。

 $('td input').width($(this).parent().width() - [$('#getPadding').css('padding-left') + $('#getPadding').css('padding-right')])
Alternatively there is a css only solution but it does not work in IE7 and below

td input {
    margin: 0px;
    width: 100%;
    height: 100%;
    border: 0px;
    display: block;
    padding: 2px 5px;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
} 
于 2012-09-28T10:32:47.187 に答える
1

要素を非表示にします。このようなもの:

 var div = $("<div class='divStyle'></div>"); // Create
     $(body).append(div);  // Render
     $(div).hide();  // Hide immediately
 var border = $(div).css("border");  // Get value
    $(div).remove();   // Destroy
于 2012-09-28T10:45:47.680 に答える