jQuery - 如果元素被隱藏，$（this）.width（）不起作用！

如何獲取隱藏元素的寬度（設置爲CSS樣式）？

CSS：

a{ 
    position: absolute; 
    width: 40px; 
    height: 40px; 
    background: pink; 
}

JS：

var nav = $('.nav'); 
nav.hide(); 

nav.hover(function(){ 
    nav.stop().animate({opacity: 1}, 300); 
}, function(){ 
    nav.stop().animate({opacity: 0}, 500); 
}); 

$('<a>', { 
css: { left: 940/2 - ($(this).width()/2), // <-- here it seems to be 0 
click: function(){ 
    alert($(this).width()); // here it works 
    return false; 
    } 
}).appendTo(nav);

來源

2011-05-02 Alexa

你使用'知名度：hidden'或'顯示：none'？ – 2011-05-02 09:41:40

我發佈了代碼。它不完全是這樣的，但它與我所擁有的相似。 – Alexa 2011-05-02 09:51:13

- 假設你想要的.nav元素（已被隱藏的元素）的寬度。

，因爲你正在使用$('<a>')你實際上是創建一個錨標記，並在這種情況下，$（這）將引用錨元素，而不是.nav元素，因此其寬度出來爲0

如果你想獲得你可以使用的.nav元素的寬度，可以使用

$('.nav').width();這會得到匹配元素的寬度。

來源

2011-05-02 10:01:59

不，我想獲得''的寬度，這是40px – Alexa 2011-05-02 10:03:42

試試這個請：

$('a').click(function(){ 
    $(this).appendTo(nav); 
    alert($(this).width()); 
    $(this).css('left', ($(this).width()/2)); 
    return false; 
})

來源

2011-05-02 10:09:00 thecodeparadox

@Alexa它不起作用請評論我，我會嘗試修改它。 – thecodeparadox 2011-05-02 10:09:45

我不認爲這可以工作。「this'沒有綁定到創建元素的根本問題仍然爲 – 2011-05-02 10:11:05

@Pekka這會警告'a'的寬度，也會附加到帶有計算的'left'的'nav'。 – thecodeparadox 2011-05-02 10:15:13

這可能是不可能的，因爲$(this)指的是在這種情況下，window對象，而不是<a>元素。僅當在函數的上下文中調用時，this引用纔會正確綁定到新創建的元素。

可能有一種方法使用閉包將元素注入到this中，但我無法弄清楚是否有人想知道某人是否可以提出解決方案。

在此之前，這種替代是那麼優雅，但永遠是可行的：

mylink = $('<a>', { 
    id: 'test', 
    click: function(){ 
    alert($(this).width()); // here it works 
    return false; 
} 
}).appendTo($("body")).html("Test");; 

mylink.css({ left: mylink.width()/2});

JSFiddle

來源

2011-05-02 10:09:30

jQuery - 如果元素被隱藏，$（this）.width（）不起作用！

回答

相關問題