HTML输入只读截尾的文本

我的只读输入元素的值被截断。有没有办法纠正这种情况，而不改变字体类型或字体大小？ https://jsfiddle.net/hockchailim/tkg7a4c8/HTML输入只读截尾的文本

<style> 
input[readonly] { 
    border: none; 
    font-size: .85em; 
    font-family: "Segoe UI", Verdana, Helvetica, Sans-Serif; 
    width: auto; 
} 
</style> 
<input readonly="readonly" type="text" value="[email protected]">

来源

2016-07-22 HockChai Lim

改变输入的大小。您唯一的选择是更改字体大小或输入大小。我也建议不要试图根据它的值设置输入的宽度，这可能会导致各种奇怪的情况。 – hungerstar

变化宽度为100％

$(document).ready(function() { 
 
    var count = $("#readonly").val().length; 
 
    $("#readonly").css("width","calc("+ count +" * 0.85em)"); 
 
});

input[readonly] { 
 
    background-color: transparent; 
 
    border: none; 
 
    font-size: .85em; 
 
    font-family: "Segoe UI", Verdana, Helvetica, Sans-Serif; 
 
    margin: 3px 0 3px 0; 
 
    padding: 2px; 
 
    
 
}

<script src="https://code.jquery.com/jquery-1.11.3.js"></script> 
 
<input id="readonly" readonly="readonly" type="text" value="[email protected]">

来源

2016-07-22 20:59:17

那么，有没有办法让它自动展开（如td）？ –

我删除了宽度并添加了按照字符数计算的jQuery这种方式它会自动扩展，我希望这有助于:) –

那么...你不想改变字体类型/大小？输入宽度怎么样？获取width:250px而不是自动修复问题。

来源

2016-07-22 20:57:52 nicael

HTML输入只读截尾的文本

回答

相关问题