Обнаружить изменение, если входной текст изменен с помощью JavaScript - PullRequest
Новая
       36

Обнаружить изменение, если входной текст изменен с помощью JavaScript

0 голосов
/ 16 мая 2019

Резюме - я работаю над инструментом сравнения текста. У меня две функции - анализатор Excel, который извлекает данные из файла Excel и динамически / программно изменяет вводимый текст.
- функция сравнения текста прослушивает любые изменения в поле ввода и запускает логику сравнения текста.

Я новичок в jQuery, но пробовал JS с помощью EventListeners, oninput, onchange, onpaste и т. Д. Примечание. Следующий фрагмент кода объясняет ситуацию. Однако такого нажатия кнопки не существует. 

var a = document.getElementById("test");

function assignValue() {
  a.value = "Hello World";
}
a.addEventListener('input', recInput);

function recInput() {
  console.log("Sucess!");
}
<input id="test">
<button onclick="assignValue()">Click to add text</button>

Есть ли способ захвата изменений с помощью JS? Если нет, я открыт для использования jQuery.

Ответы [ 2 ]

1 голос
/ 16 мая 2019

Для этого можно использовать MutationObserver API .

Зарегистрировать функцию обратного вызова, которая будет работать с изменяющимся атрибутом. 

const input = document.getElementById('name');
const observer = new MutationObserver(list => {
  console.log("New Value: ", list[0].target.value);
})
observer.observe(input, {
  attributes: true,
  childList: false,
  subtree: false
});

function changeIt() {
  const randomString = Math.random() >= 0.5 ? "one" : "two";
  input.setAttribute("value", randomString);
  input.value = randomString;
}
<input placeholder="Enter some text" name="name" id="name" />
<button onclick='changeIt()'>Push me
</button>

Вам нужно будет использовать setAttribute(), и вам нужно будет установить свойство value элемента Input, чтобы синхронизировать его с атрибутом.(как видно из функции changeIt().

0 голосов
/ 16 мая 2019

Для этого вы можете использовать onkeydown . 

var a = document.getElementById("test");

a.addEventListener('onkeydown', recInput);

function recInput(e) {
  console.log("Sucess!", e.key);
}
...