Bir öğenin kenar boşluğu boyutunu jquery ile alın

Question

Bir öğenin özelliklerini jquery ile nasıl edinebilirim? Özellikle bir divın sınırının büyüklüğünü almak istiyorum.

Bu kod ile çalıştı

<form> 
... 

<div class="item-form"> 
    <textarea class="autohide"></textarea> 
</div> 

... 

</form> 

Ben örneğin bir .css dosyasında div stilini belirledik,

.item-form { 
    margin:0px 0px 10px 0px; 
    background: blue; 
} 

html, ama belli ki başarısız,

$(".autohide").each(function(){ 

var $this = $(this); 
alert($this.parents("div:.item-form").css("margin")); 


}); 

herhangi bir fikir? Teşekkürler.

Answer 1

CSS etiketi 'marjı', gerçekte dört ayrı kenar boşluğu değeri için üst/sol/alt/sağ kısaltmasıdır. css('marginTop'), vb. Kullanın - eğer onları bu şekilde belirttiyseniz, sonunda 'px' olacaklarını unutmayın.

parseInt()'u, sonuçta sayı değerine çevirmek için kullanın.

NB. Omaty tarafından belirtildiği gibi, shorthand 'margin' etiketinin sırası: top right bottom left - yukarıdaki liste, liste sırasına göre tasarlanan bir şekilde yazılmamıştır, sadece etikette belirtilenlerin bir listesi.

Sen kullanmak isteyeceksiniz

Answer 2

...

alert($this.parents("div:.item-form").css("marginTop").replace('px', '')); 
alert($this.parents("div:.item-form").css("marginRight").replace('px', '')); 
alert($this.parents("div:.item-form").css("marginBottom").replace('px', '')); 
alert($this.parents("div:.item-form").css("marginLeft").replace('px', '')); 

Answer 3

jQuery's website itibaren

Steno CSS özellikleri (örneğin marjı, arka plan, sınır) desteklenmez. Örneğin, işlenen kenar boşluğunu almak istiyorsanız, aşağıdakileri kullanın: $ (elem) .css ('marginTop') ve $ (elem) .css ('marginRight'), vb.

Answer 4

Exemple için: var olur

var myMarginTop = $("#myBlock").css("marginBottom"); 

"15px", bir dize: Bu ise

<div id="myBlock" style="margin: 10px 0px 15px 5px:"></div> 

kod js.

Bir Tamsayı istiyorsanız, NaN'den (Numara Değil) kaçınmak için birden çok yol vardır.

var myMarginTop = parseInt($("#myBlock").css("marginBottom"));