如何使这个禁用的输入充当启用的输入并在单击按钮时滚动？答案

【问题标题】：how can i make this disabled input act as an enabled one and scroll when you click the buttons?如何使这个禁用的输入充当启用的输入并在单击按钮时滚动？
【发布时间】：2023-03-04 19:04:02
【问题描述】：

我正在玩一个键盘登录的想法。我的问题是如何使禁用的输入表现得像常规的启用输入？如果文本大于输入长度，我希望文本在您单击按钮时滚动。

function setOne(){ document.getElementById('someText').value += "A"; }
function setTwo(){ document.getElementById('someText').value += "B"; }

<input id="someText" type="text" disabled="disabled">

<div>
<button onclick="setOne();">A</button>
<button onclick="setTwo();">B</button>
</div>

请不要使用 jQuery。谢谢你！

【问题讨论】：

标签： javascript html forms input

【解决方案1】：

disabled 输入无法接收焦点，Please read heredisabled 无法触发文本选择，尝试 readonly 将接收您要添加的焦点。

function setOne(){ document.getElementById('someText').value += "A";focus(); }
function setTwo(){ document.getElementById('someText').value += "B";focus(); }
function focus(){
var foo =document.getElementById('someText');
foo.focus();
foo.setSelectionRange(foo.value.length,foo.value.length);

}

#someText{
opacity:0.3;
background-color:gray;
}

<input id="someText" type="text" readonly>

<div>
<button onclick="setOne();">A</button>
<button onclick="setTwo();">B</button>
</div>

【讨论】：

这似乎在 Edge 或 IE 中不起作用，对此有何想法？
@Jonny 看看这似乎是错误：developer.microsoft.com/en-us/microsoft-edge/platform/issues/…
在输入中使用 dir="rtl" 会有什么缺点？这似乎适用于ie和edge？处理数据的任何问题
@Jonny 我不这么认为，你也可以用 rtl 试试，只要确保你当前在 rtl 中附加数据，你需要相应地预先设置和设置焦点。
没想到会有多大效果，我用document.write检查了一下，输入是一样的。