表单输入事件监听器

我有一个正在使用JavaScript动态更新的输入表单。使用d3，我想创建一个事件监听器，每次操作这个输入时都会运行一个函数。表单输入事件监听器

目前，如果手动更改输入字段，它将运行，但如果使用JavaScript更新，则不会运行。我曾尝试使用.on("change",...和.on("input",...。

这里是我想获得的功能实例：

<!DOCTYPE html> 
<meta charset="utf-8"> 

<input value="0" id="input1"> 
<button onclick="clickFunc();">Click Me</button> 


<script src="http://d3js.org/d3.v3.min.js"></script> 
<script> 

d3.select("#input1").on("input", function() { 
// not printing when updated by javascript 
    console.log('value changed'); 
}); 

function clickFunc() { 
    document.getElementById('input1').value = document.getElementById('input1').value + 1; 
} 

</script>

来源

2017-04-19 Anna

您需要使用MutationObserver窗口类观察输入的由JS触发的更改。

请记住，简单地设置输入的节点value属性，例如，不会触发MutationObserver。您必须调用setAttribute(value, "value")才能获得由MutationObserver获取的更改。

这里有一个工作的例子，我做了：

当然，这是一种香草JS的解决方案。如果你不关心香草和使用jQuery是一个愿望，您可以尝试使用此jQuery回答：Detect all changes to a <input type="text"> (immediately) using JQuery

虽然，我不能保证它会工作。没有测试过。

来源

2017-04-19 19:00:45 Denialos

您可以在一个input元素的oninput=""属性执行功能。

<input type="text" oninput="myFunction()">

在JS，你也可以使用：

$("myobject").oninput = function(){myScript};

，或者你是这一个更好：

$("myobject").addEventListener("input", myScript);

来源

2017-04-19 17:48:23 Felix

表单输入事件监听器

回答

相关问题