当前位置: 首页 > 面试题库 >

重点关注时,如何使用Reactjs选择输入中的所有文本?

陶成化
2023-03-14
问题内容

例如:codepen

var InputBox = React.createClass({
  render: function() {
    return (
      <input className="mainInput" value='Some something'></input>
    )
  }
});

问题答案:
const handleFocus = (event) => event.target.select();
const Input = (props) => <input type="text" value="Some something" onFocus={handleFocus} />

ES6 class component

class Input extends React.Component {
    handleFocus = (event) => event.target.select();

    render() {
        return (
            <input type="text" value="Some something" onFocus={this.handleFocus} />
        );
    }
}

React.createClass

React.createClass({
    handleFocus: function(event) {
      event.target.select();
    },

    render: function() {
      return (
        <input type="text" value="Some something" onFocus={this.handleFocus} />
      );
    },
})


 类似资料:
  • 问题内容: 我有以下代码在HTML网页中显示文本框。 显示页面时,文本包含“ 请输入用户ID” 消息。但是,我发现用户需要单击3次才能选择所有文本(在这种情况下, 请输入用户ID )。 只需单击一下就可以选择整个文本吗? 编辑: 抱歉,我忘了说:我必须使用输入 问题答案: 您可以使用以下javascript代码段: 但显然,它不适用于移动Safari。在这种情况下,您可以使用:

  • 问题内容: 我有文件上传输入: 我这样处理上传: 如果我两次上传相同的文件,则不会触发上传事件。我该如何解决?对于简单的js代码,只需执行以下操作:this.value = null; 在变更处理程序中。我该如何使用ReactJS? 问题答案: 我认为您可以像这样清除输入值: 文件输入无法控制,没有React特定的方式来实现。

  • 问题内容: 我有一个使用Swing的小型Java桌面应用程序。有一个数据输入对话框,其中包含一些不同类型的输入字段(JTextField,JComboBox,JSpinner,JFormattedTextField)。当我通过在表单中​​进行制表或通过单击鼠标来激活JFormattedTextFields时,我希望它选择当前包含的所有文本。这样,用户可以开始输入并覆盖默认值。 我怎样才能做到这一点

  • 问题内容: 我有文字输入。当输入获得焦点时,我想选择输入内的文本。 使用jQuery,我可以这样: 我四处搜寻以尝试找到Angular方式,但是我发现的大多数示例都在处理一个指令,该指令正在监视模式属性的更改。我假设我需要一个指令来监视接收焦点的输入。我该怎么办? 问题答案: 在Angular中执行此操作的方法是创建一个自定义指令,该指令会为您自动选择。 应用如下指令: Update1 :删除了j

  • 问题内容: 在将此标记为重复之前,我希望您认识到,实际上没有人为这个特定问题提供好的答案。在焦点/单击时选择contenteditable div中的所有文本时,接受的答案和TimDown的答案都无济于事,因为它们仅在元素已被聚焦时才起作用。就我而言,我希望单击一个按钮后即可选择contenteditablediv中的所有文本,即使该div事先未聚焦。 我该怎么办? 问题答案: 我使用了该线程中的

  • 问题内容: 我有以下HTML标记: 当我使用CSS选择器时,我得到了。 不幸的是,我不能更改标记,而只能使用CSS选择器,因为我使用的是聚合RSS提要的系统。 是否有我只能接受文本节点的CSS选择器?具体在这个例子中? 问题答案: 这里的问题是您写入屏幕的内容没有显示在DOM:P中。 也似乎还行不通(至少在Safari 6.0.3中对我来说),或者它根本还没有产生预期的结果。 最后是属性选择器,使