JavaScript 以编程方式监听输入值变化

Answer 1

您可以添加全局输入处理程序并过滤输入名称。

现在，您可以调度一个冒泡的输入事件。

// Add a global listener
document.addEventListener('input', function(event) {
  // Filter on the name
  if (event.target.name === 'MyDatePicker') {
    handleChange(event); // Forward the event
  }
});

// Handle as if we attached this to input[name="MyDatePicker"]
function handleChange(event) {
  console.log('Current value:', event.target.value);
}

// Fire the change event (bubble up to the global handler)
const element = document.querySelector('input[name="MyDatePicker"]');
setInputValue(element, 'F');

// Set the input element's value and fire the change event
function setInputValue(inputElement, value, bubbles=true) {
  inputElement.value = value;
  inputElement.dispatchEvent(new CustomEvent('input', { bubbles }));
}

<input
  type="text"
  name="MyDatePicker"
  role="combobox"
  size="1"
  autocomplete="off">