Javascript 如何知道文本区域中何时有选定文本而不是轮询？ 类Blog扩展了React.Component{ 建造师（道具）{ 超级（道具）； this.interval=null； this.selectionStartIndex=null； this.selectionEndIndex=null； } 组件willmount（）{ this.interval=setInterval（（）=>{ 此.setSelectionIndex（document.activeElement）； }, 100); } 组件将卸载（）{ clearInterval（这个.interval）； } setBlog=（blog，cb）=> this.setState（{blog}，（）=>{ this.code.innerHTML=blog； cb&&cb（）； }); 设置选择索引=元素=>{ 如果（elem.tagName==='TEXTAREA'）{ this.selectionStart index=elem.selectionStart； this.selectionEndIndex=elem.selectionEnd； } }; render（）{ 返回( this.setBlog（e.target.value）} 行={8} /> ); } }

我正在做一个降价编辑。在中，我发现了一个关于如何从文本区域获取选定值的问题。正如您在方法中看到的，它使用setInterval不断检查是否有选定的文本，但我对使用此方法在文本区域中获取选定的文本感到非常失望。是否有更好的方法（如事件）来了解文本区域中何时有选定文本而不是轮询？

您已经有了该机制：

class Blog extends React.Component {
  constructor(props) {
    super(props);
    this.interval = null;
    this.selectionStartIndex = null;
    this.selectionEndIndex = null;
  }

  componentWillMount() {
    this.interval = setInterval(() => {
      this.setSelectionIndexes(document.activeElement);
    }, 100);
  }

  componentWillUnmount() {
    clearInterval(this.interval);
  }

  setBlog = (blog, cb) =>
    this.setState({ blog }, () => {
      this.code.innerHTML = blog;
      cb && cb();
  });

  setSelectionIndexes = elem => {
    if (elem.tagName === 'TEXTAREA') {
      this.selectionStartIndex = elem.selectionStart;
      this.selectionEndIndex = elem.selectionEnd;
    }
  };
  render() {
    return (

      <TextArea
        value={blog}
        onChange={e => this.setBlog(e.target.value)}
        rows={8}
      />
    );
  }
}

---

我想setBlog（）是某种状态存储？如果不是，只需使用setState（）存储该值。（你发布的代码中没有）。为什么不直接检查存储中的值？

在文本区域的鼠标上检查？当人们用键盘进行选择时，在键盘上。。。没有尝试过，但它可能会起作用。您的问题得到回答了吗？您现在可以检查setBlog（），但我认为onChange不起作用。

onChange={e => this.setBlog(e.target.value)}

document.onmouseup = document.onkeyup = document.onselectionchange = function() {
    var aEl = document.activeElement;
    var aElTagName = aEl ? aEl.tagName.toLowerCase() : null;
    if (aElTagName == "textarea") {
        alert(aEl.value.slice(aEl.selectionStart, aEl.selectionEnd));
    }
};