1

私はjQueryの経験があまりないので、次のことを手伝っていただければ幸いです。現在、指定されたdivの幅をピクセル単位で取得できますが、これをさらに開発して、取得するdivの数をリストできるようにしたいと思います添付コードの幅。

#divA があることがわかります。たとえば、同じステートメントで #divB と #divC も取得したいと思います。例(私はこれを試しましたが、正しくありません)>

var txt="";
txt+="Width of div: " + $("#divA, #divB, #divC").width() + "</br>";
txt+="Height of div: " + $("#divA, #divB, #divC").height();
$("#divA, #divB, #divC").html(txt);

また、ビューポート/ブラウザが幅を変更すると、出力された div 幅をその場で更新できますか?これは可能ですか? 便利なページの更新を節約できます。

それが理にかなっていることを願っています。

<script>
$(document).ready(function(){
$("button").click(function(){

var txt="";
txt+="Width of div: " + $("#divA").width() + "</br>";
txt+="Height of div: " + $("#divA").height();
$("#divA").html(txt);


});
});
</script>
4

1 に答える 1

1

可能です。あなたのマークアップなしで、私は(あなたのように)3つのdivで自分自身を作成し​​ました。ウィンドウのサイズが変更されると、その高さと幅がコンソールに記録されます。それらの幅は%として設定されます。これがお役に立てば幸いです。

これがあなたが望むものであるかどうか私に知らせてください。私はあなたが何を求めているのか100%確信していません。

デモ:

作業デモ

Javascript:

$(window).resize(function() {
    $(".divResized").each(function(i,item){
        item = $(item);
        console.log(item.width(),item.height())
    });
});

HTML:

<div id="divA" class="divResized">
    test
</div>
<div id="divB" class="divResized">
    test1
</div>
<div id="divC" class="divResized">
    test2
</div>

Css:

#divA{
    width:33%;
}

#divB{
    width:17%;
}

divC{
    width:50%;
}

編集: 別のdivに書き込みたい場合は、その小さな例を次に示します。リンク

于 2013-03-23T10:50:37.853 に答える