在隱藏溢出的父級獲取文本內容寬度

我試圖獲得與Excel類似的功能，雙擊列重新分級並將特定列擴展到該列中的最大內容寬度。在隱藏溢出的父級獲取文本內容寬度

問題：我不知道如何獲得帶有溢出隱藏和文本溢出省略號的div內的文本內容寬度。而且我不確定我需要申請這項工作的技巧。我從來沒有嘗試過這樣的事情。

當前的HTML標記：

<div style="width: @manuallySetWidthInPx">text</div>

當前CSS：

position: relative; 
min-width: 50px; 
float: left; 
padding: 5px; 
-moz-box-sizing: border-box; 
-webkit-box-sizing: border-box; 
box-sizing: border-box; 
white-space: nowrap; 
overflow: hidden; 
-ms-text-overflow: ellipsis; 
-o-text-overflow: ellipsis; 
text-overflow: ellipsis;

我如何需要重新因子<div />和CSS來獲得內部文本內容實際寬度？
我很好，使用jQuery。

注意：我試圖做到這一點，同時保持文本省略，所以如果我需要克隆該行，我很好。

來源

2013-10-06 skmasq

我做一個DIV，並把它關閉屏幕下面的CSS

#two{ 
    width: auto !important; 
    top: -100px; 
}

HTML

<div id = "one"> 
    gibbfasdfsdfasdfasdfasdfasdfASDadsAS 
</div> 

<div id = "two"> 


</div>

然後使用以下JavaScript來所示DIV的文本傳送至隱藏DIV和抓住隱藏的DIV寬度。

$(document).on("click", "#one", function(){ 
    var value = $("#one").text(); 
    $("#two").text(value); 
    var div_width = $("#two").width(); 
    alert(div_width); 
});

小提琴here

根據您使用上面的JavaScript代碼的情況下，可能會有一些性能問題。我沒有看到任何運行200次循環的問題，雖然

來源

2013-10-06 09:11:21

在你的例子中，你打開div。我想要的是在px中獲得該寬度而不改變div的顯示方式。是否有可能在背景設置寬度自動複製這個div然後獲取寬度，然後將其刪除？如果是的話，它會不會影響性能，如果我將遍歷200個元素克隆和刪除？ – skmasq

@skmasq我明白你在問什麼。查看更新後的答案 –

在隱藏溢出的父級獲取文本內容寬度

回答

相關問題