html字段省略,如何在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;

}

2020-05-16

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值