Question

是否可以全局更改HTML'onChange'？

例如，我可以做到这样，以便onChange始终调度（redux调度）每个事件处理程序的返回值吗？

是的，我知道这可能是您可以做的最邪恶的事情。我试图了解如何在语言级别实现事件处理程序。

知道这将如何影响IE React框架会很有趣，但是这个问题本身就是针对浏览器/ DOM的。在这种情况下，“真实的” onChange。

示例

<html>
<head>
<script type="text/javascript>

//is there anything we can do here to make the onchange below
//do something with the 5 it returns?

//for example, maybe console.log it, or redux dispatch it?

</script>
</head>
<body>

<input type="text" onChange="function(event){return 5;}" />

</body>
</html>

Answer 1

是的，您可以通过更改EventTarget原型内的addEventListener函数来实现。考虑以下示例：

const oldAddEventListener = EventTarget.prototype.addEventListener;
EventTarget.prototype.addEventListener = function(eventName, eventHandler, useCapture) {
  const modifiedEventHandler = function(event) {
    if (event.type === 'change') {
      //dispatch your action here
      store.dispatch(....);
    }
    eventHandler(event);
  };
  oldAddEventListener.call(this, eventName, modifiedEventHandler, useCapture);
}

如果事件类型为'change'，它将首先运行您在if (event.type === 'change') {...}块中拥有的自定义代码，然后继续正常流程，调用事件处理程序函数。否则，它将仅在正常流程中调用事件处理程序函数。

我不建议在一个严肃的项目中更改EventTarget原型，因为它可能导致无法预料的问题，尤其是在使用第三方脚本时。但是出于教育目的，我建议您试用原型并更改javascript的原始行为，因为它可以帮助您更好地了解javascript。另外，原型很有趣！ =）

您可以全局更改onChange吗？

是否可以全局更改HTML'onChange'？

1 个答案: