以编程方式添加文本后,如何在输入中显示文本结尾?

合作

我想以编程方式在输入中添加单词,并始终看到文本的结尾。但是问题在于,当我添加单词(如input.value += 'word')时,如果文本的长度几乎与输入的长度相同,则输入内的文本不会移动,因此我只能看到文本的开头和结尾被隐藏了。
我认为,如果我可以将光标放在输入的末尾会有所帮助,但是光标无法在Chrome中正常工作的技巧,例如

input.value = input.value

或者

input.setSelectionRange(input.value.length, input.value.length);
JDB仍然记得莫妮卡

如果输入没有焦点,那么Chrome会一直向左滚动显示它“滚动”,并显示输入值的开头。

如果元素具有焦点,则可以设置选择范围以移动光标:

window.onload = function(){
  
  var input = document.getElementById('foobar');
  input.value += ' bazbat';
  
  input.focus();
  input.setSelectionRange( input.value.length - 1 );
  
}
<input id="foobar" value="foobar" size="6">

但是,如果在用户尝试键入值时光标在四处移动,这将是一个非常令人困惑和令人沮丧的UX。

要考虑的其他选项:

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

在UITextfield中输入文本后以编程方式更改焦点

来自分类Dev

以编程方式添加的按钮不显示文本

来自分类Dev

如何在android中以编程方式在textinputlayout中添加自动完成文本

来自分类Dev

如何在Android中的RelativeLayout中以编程方式在按钮旁边显示文本视图?

来自分类Dev

如何在swift ios中以编程方式添加多个文本字段

来自分类Dev

Java 编程 - 如何在数字格式后添加文本?

来自分类Dev

如何在Laravel表单文本输入中添加静态文本?

来自分类Dev

如何在TBCEditor中以编程方式设置文本选择?

来自分类Dev

如何在Android中以编程方式获取文本的阴影颜色?

来自分类Dev

如何在TBCEditor中以编程方式设置文本选择?

来自分类Dev

在稍后使用共享首选项作为建议输入后,如何在编辑文本中显示最近输入的文本?

来自分类Dev

在聚合物纸输入中以编程方式突出显示文本

来自分类Dev

如何在每个以编程方式添加的文本框旁边添加标签

来自分类Dev

如何在宏中添加“输入”以替换Notepad ++中的文本?

来自分类Dev

以编程方式更改值时如何在文本输入上触发 onChange 事件 - 反应

来自分类Dev

如何使输入字段在提交后添加文本

来自分类Dev

在以编程方式显示的超链接中显示URL以外的文本

来自分类Dev

如何在输入表单中添加静态文本

来自分类Dev

如何在输入中添加Java图标和阵容文本?

来自分类Dev

如何在ios 8的alertview中添加文本输入?

来自分类Dev

如何在输入中添加Java图标和阵容文本?

来自分类Dev

如何在输入值中添加静态文本

来自分类Dev

如何在地址栏中不显示输入文本

来自分类Dev

如何在html输入文本中显示mysql数据?

来自分类Dev

斜杠后如何在href中添加文本

来自分类Dev

如何通过使用Swift单击按钮以编程方式将文本输入到UITextView中

来自分类Dev

如何以编程方式在当前光标位置的UITextView中输入文本

来自分类Dev

我如何设置值以在jQuery中以编程方式输入文本框

来自分类Dev

搜索后如何在Vim中编辑突出显示的文本

Related 相关文章

  1. 1

    在UITextfield中输入文本后以编程方式更改焦点

  2. 2

    以编程方式添加的按钮不显示文本

  3. 3

    如何在android中以编程方式在textinputlayout中添加自动完成文本

  4. 4

    如何在Android中的RelativeLayout中以编程方式在按钮旁边显示文本视图?

  5. 5

    如何在swift ios中以编程方式添加多个文本字段

  6. 6

    Java 编程 - 如何在数字格式后添加文本?

  7. 7

    如何在Laravel表单文本输入中添加静态文本?

  8. 8

    如何在TBCEditor中以编程方式设置文本选择?

  9. 9

    如何在Android中以编程方式获取文本的阴影颜色?

  10. 10

    如何在TBCEditor中以编程方式设置文本选择?

  11. 11

    在稍后使用共享首选项作为建议输入后,如何在编辑文本中显示最近输入的文本?

  12. 12

    在聚合物纸输入中以编程方式突出显示文本

  13. 13

    如何在每个以编程方式添加的文本框旁边添加标签

  14. 14

    如何在宏中添加“输入”以替换Notepad ++中的文本?

  15. 15

    以编程方式更改值时如何在文本输入上触发 onChange 事件 - 反应

  16. 16

    如何使输入字段在提交后添加文本

  17. 17

    在以编程方式显示的超链接中显示URL以外的文本

  18. 18

    如何在输入表单中添加静态文本

  19. 19

    如何在输入中添加Java图标和阵容文本?

  20. 20

    如何在ios 8的alertview中添加文本输入?

  21. 21

    如何在输入中添加Java图标和阵容文本?

  22. 22

    如何在输入值中添加静态文本

  23. 23

    如何在地址栏中不显示输入文本

  24. 24

    如何在html输入文本中显示mysql数据?

  25. 25

    斜杠后如何在href中添加文本

  26. 26

    如何通过使用Swift单击按钮以编程方式将文本输入到UITextView中

  27. 27

    如何以编程方式在当前光标位置的UITextView中输入文本

  28. 28

    我如何设置值以在jQuery中以编程方式输入文本框

  29. 29

    搜索后如何在Vim中编辑突出显示的文本

热门标签

归档