Question

我正在开发一个浏览器扩展程序（谷歌浏览器和Firefox），它使用内容脚本来更改textarea值。我正在使用这个脚本：

在谷歌浏览器上我使用这个脚本：

function print(msg, textarea){
  textarea.focus();
  textarea.click();
  textarea.value = '';
  for(var i=0; i<msg.length;i++){
    var e = document.createEvent('KeyboardEvent');
    e.initKeyboardEvent("keypress", true, true, null, false, false, false, false, 0, msg.charCodeAt(i));
    textarea.dispatchEvent(e);
    textarea.value += msg[i];
  }
}

在某些使用AJAX的网站上，textarea的值已正确更新，但由于某些原因，当我提交表单时，会发布旧的textarea内容。如果我手动按一个键，问题就解决了。

我无法理解问题所在。我用jQuery尝试了$（textarea）.keydown（）。keypress（）。keyup（）。change（）或.blur（）但它没有帮助。

Answer 1

弗拉迪米尔是对的，问题通常是隐藏的领域和关键事件。触发顺序是关键。我相信一个正确的方法是：

for(var i=0; i<msg.length;i++){
  var e = document.createEvent('KeyboardEvent');
  e.initKeyboardEvent("keydown", true, true, null, false, false, false, false, 0, msg.charCodeAt(i));
  textarea.dispatchEvent(e);

  var e = document.createEvent('KeyboardEvent');
  e.initKeyboardEvent("keypress", true, true, null, false, false, false, false, 0, msg.charCodeAt(i));
  textarea.dispatchEvent(e);

  textarea.value += msg[i];

  var e = document.createEvent('KeyboardEvent');
  e.initKeyboardEvent("keyup", true, true, null, false, false, false, false, 0, msg.charCodeAt(i));
  textarea.dispatchEvent(e);
}

它适用于firefox和google chrome（但firefox使用initKeyEvent而不是initKeyboardEvent）

发布动态更改的textarea值并不适用于ajax表单

1 个答案: