gpt4 book ai didi

javascript - 调整浏览器大小时文本上的 CSS 省略号

转载 作者:行者123 更新时间:2023-11-28 06:09:27 28 4
gpt4 key购买 nike

我有一个<table>宽度设置为 100%。里面<td>是一个带有文本字符串的 div,如果文本宽度溢出,我想在其中添加省略号。

在 javascript 中,我设置了 <div> 的宽度到 <td> 的宽度这在加载(或刷新)时工作正常,但我无法让它工作 onresize .

(不要担心我实际上在这里做什么。它是我为了解决这个问题而简化的更大表格的一部分。)

任何人都可以告诉我如何让文本省略 onresize

function doThis() {
$('.divClass').css('width', $(".tdClass").css('width'));
}
.divClass {
width:0px;
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<body onload="doThis()" onresize="doThis()">

<table style="width:100%">
<tr>
<td class="tdClass">
<div class="divClass">
the quick brown fox jumps over the lazy dog the quick brown fox jumps over the lazy dog the quick brown fox jumps over the lazy dog the quick brown fox jumps over the lazy dog the quick brown fox jumps over the lazy dog the quick brown fox jumps over the lazy dog
</div>
</td>
</tr>
</table>

</body>

最佳答案

如果对 body 属性不起作用,请尝试将调整大小与浏览器窗口绑定(bind)

$(window).resize(function(){
doThis()
});

关于javascript - 调整浏览器大小时文本上的 CSS 省略号,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/36540143/

28 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com