解决方案：

Question

我正在尝试使用普通JS或Jquery自动提交对Steemit帖子的回复。

我使用了下面的javascript代码，但是该按钮保持禁用状态，因此不允许发布回复/评论。

如何正确触发文本区域上的keydown / keypress / keyup事件，以模拟用户“经典”交互以发送回复？

谢谢

目标示例：https://steemit.com/usa/@gaottantacinque/happy-4th-of-july

在开发工具控制台中：

function nap (durationMs) {
  new Promise(resolve => setTimeout(() => resolve(), durationMs))
}

async function replyToPost() {
  var replyBtn = document.getElementsByClassName("PostFull__reply")[0]
    .getElementsByTagName('a')[0];
  replyBtn.click();
  await nap(1000);
  var textarea = document.getElementsByTagName('textarea')[0];
  const msg = 'My programmatically generated comment goes here';
  textarea.focus();
  textarea.click();
  textarea.value = msg; // textarea.innerHTML = msg; textarea.innerText = msg;
  await nap(100);
  var postReplyBtn = document.querySelectorAll('[type=submit]')[1];
  // postReplyBtn.disabled = false;
  postReplyBtn.click();
}

replyToPost();

注意：该代码将填充文本区域，但该按钮仍处于禁用状态。只需手动单击文本区域，然后键入任何内容即可启用按钮。

此外，例如，在背景上单击后，以编程方式插入的textarea值会消失，但在正常输入时不会消失。

Answer 1

尝试了一切之后，我发现问题似乎是React触发文本区域的onchange的一个错误。

More info on the bug

有一种解决方法。

解决方案：

function setNativeValue(element, value) {
  const valueSetter = Object.getOwnPropertyDescriptor(element, 'value').set;
  const prototype = Object.getPrototypeOf(element);
  const prototypeValueSetter = Object.getOwnPropertyDescriptor(prototype, 'value').set;

  if (valueSetter && valueSetter !== prototypeValueSetter) {
    prototypeValueSetter.call(element, value);
  } else {
    valueSetter.call(element, value);
  }
}

var textarea = document.getElementsByTagName('textarea')[0];
setNativeValue(textarea, 'My automated comment here');
textarea.dispatchEvent(new Event('input', { bubbles: true }));

Answer 2

这可能不适用于某些情况，因为它不适用于我，但这是一个通用的解决方案：

 const textarea = document.getElementsByTagName('textarea')[0]
function setNativeValue(element, value) {
  const { set: valueSetter } = Object.getOwnPropertyDescriptor(element, 'value') || {}
  const prototype = Object.getPrototypeOf(element)
  const { set: prototypeValueSetter } = Object.getOwnPropertyDescriptor(prototype, 'value') || {}

  if (prototypeValueSetter && valueSetter !== prototypeValueSetter) {
    prototypeValueSetter.call(element, value)
  } else if (valueSetter) {
    valueSetter.call(element, value)
  } else {
    throw new Error('The given element does not have a value setter')
  }
}
setNativeValue(textarea, 'some text')
textarea.dispatchEvent(new Event('input', { bubbles: true }))

我还要感谢之前发布它的人......它真的帮助了很多

here is where i found it:

使用javascript以编程方式填充和提交textarea

2 个答案:

解决方案：