如何在html输入字段中使用文本溢出省略号?

如何在html输入字段中使用文本溢出省略号?,第1张

如何在html输入字段中使用文本溢出省略号

我知道这是一个老问题,但是我遇到了同样的问题,对我有用,所以我想我愿意分享,以防人们仍然好奇。该博客的要旨是,您也可以在IE中的输入中执行省略号,但前提是该输入具有

readonly
属性。

显然,在许多情况下,我们不希望输入具有只读属性。在这种情况下,您可以使用Javascript进行切换。此代码直接来自博客,因此,如果您发现此答案有帮助,则可以考虑查看博客,并向作者发表感谢的评论。

// making the input editable$('.long-value-input').on('click', function() {  $(this).prop('readonly', '');  $(this).focus();})// making the input readonly$('.long-value-input').on('blur', function() {  $(this).prop('readonly', 'readonly');});.long-value-input {  width: 200px;  height: 30px;  padding: 0 10px;  text-overflow: ellipsis;  white-space: nowrap;  overflow: hidden;}<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script><div >  <input type="text"  value="sdghkjsdghhjdfgjhdjghjdfhghjhgkdfgjnfkdgnjkndfgjknk" readonly /></div>


欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/zaji/5567068.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2022-12-14
下一篇 2022-12-14

发表评论

登录后才能评论

评论列表(0条)

保存