jQuery: оповещение, если текстовое поле изменилось

Question

Не могли бы вы порекомендовать какой-нибудь облегченный плагин jQuery, чтобы определить, изменились ли поля, указанные селектором?

Например, вот так в SO, показывающий диалог подтверждения, когда я хочу перезагрузить страницу во время публикации.

Answer 1

Это слишком базовая / специфическая функциональность, чтобы иметь собственный плагин.

Все, что вам нужно сделать, - это сохранить логическое значение, для которого устанавливается значение true, если какой-либо элемент изменяется:

var changed = false;

$(document).ready(function() {
    $('.watch-for-changes').change(function() {
        change();
    });
    window.onbeforeunload = function() {
        if (hasChanged()) {
            return "There are unsaved changes on the page.";
        }
    };
}

function change() {
    changed = true;
}

// use this to programmatically change an input field
function changeValue(elField, value) {
    $(elField).val(value);
    change();
}

function hasChanged() {
    return changed;
}

Редактировать: предыдущее использование onbeforeunload было неверным.См. эту страницу для получения более подробной информации о его использовании.

Answer 2

Плагин не требуется:

$('selector').change( function() { alert( 'I've changed!'); } );

Тот, что на SO, отличается, он проверяет, является ли поле пустым или содержит текст по умолчанию перед тем, как выполнить действие. Это не срабатывает "при изменении".

Answer 3

На самом деле, это может быть немного сложнее, чем указано в других ответах, где просто отправка формы также вызовет событие.

Теперь все изменилось: там IS действительно полезный плагин для jquery, который делает то, что вы просили: вы уверены .

Вы можете увидеть, как это работает, с демонстрационной страницей .