gpt4 book ai didi

javascript - 将插入符号移动到文本输入字段的末尾并使末尾可见

转载 作者:塔克拉玛干 更新时间:2023-11-02 21:37:35 24 4
gpt4 key购买 nike

我要疯了。我有一个自动建议框,用户可以在其中选择一个建议。在下一个建议选择中,文本输入框的值超出了它的大小。我可以将 carat 移动到跨浏览器输入字段的末尾,没问题。但是在 Chrome 和 Safari 上我看不到最后的克拉。文本末尾不可见。

有没有办法将 carat 移动到文本输入字段的末尾并使字段的末尾可见,以便用户不会对输入的 carat 去了哪里感到困惑?

到目前为止我得到了什么:

<html>
<head><title>Field update test</title></head>

<body>
<form action="#" method="POST" name="testform">

<p>After a field is updated the carat should be at the end of the text field AND the end of the text should be visible</p>

<input type="text" name="testbox" value="" size="40">

<p><a href="javascript:void(0);" onclick="add_more_text();">add more text</a></p>

</form>

<script type="text/javascript">
<!--
var count = 0;

function add_more_text() {
var textfield = document.testform.elements['testbox'];

textfield.focus();

if (count == 0) textfield.value = ''; // clear old

count++;
textfield.value = textfield.value + (textfield.value.length ? ', ' : '') + count + ": This is some sample text";

// move to the carat to the end of the field
if (textfield.setSelectionRange) {
textfield.setSelectionRange(textfield.value.length, textfield.value.length);
} else if (textfield.createTextRange) {
var range = textfield.createTextRange();
range.collapse(true);
range.moveEnd('character', textfield.value.length);
range.moveStart('character', textfield.value.length);
range.select();
}

// force carat visibility for some browsers
if (document.createEvent) {
// Trigger a space keypress.
var e = document.createEvent('KeyboardEvent');
if (typeof(e.initKeyEvent) != 'undefined') {
e.initKeyEvent('keypress', true, true, null, false, false, false, false, 0, 32);
} else {
e.initKeyboardEvent('keypress', true, true, null, false, false, false, false, 0, 32);
}
textfield.dispatchEvent(e);

// Trigger a backspace keypress.
e = document.createEvent('KeyboardEvent');
if (typeof(e.initKeyEvent) != 'undefined') {
e.initKeyEvent('keypress', true, true, null, false, false, false, false, 8, 0);
} else {
e.initKeyboardEvent('keypress', true, true, null, false, false, false, false, 8, 0);
}
textfield.dispatchEvent(e);
}
}
// -->
</script>

</body>
</html>

最佳答案

我想到了一个解决方案。 Webkit(Safari 和 Chrome)需要试一试才能正确执行键盘事件。在退格之前添加一个 blur() 和 focus() :

  textfield.blur(); // Webkit wake-up hack
textfield.focus();
textfield.dispatchEvent(e);

谢谢。现在可在 Mac 和 Windows 上的 Safari、Chrome、FF、IE 中使用。

关于javascript - 将插入符号移动到文本输入字段的末尾并使末尾可见,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/2692009/

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