Функция preventDefault() не работает для события изменения

#javascript #onchange #preventdefault

Вопрос:

Есть идеи, почему preventDefault не работает? Вот код ниже . . . Tks!

 <head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js">

    $(document).ready(function() {
        $("#text1").change(function(e) {
             e.preventDefault();
        });
    });

function myFunc() {
    alert("Random, annoying alert");
}

</script>
</head>

Только один HTML-элемент в форме:

 <body>
<form name="test" method="post">
    <input name="text1" id="text1" type="text" onchange="myFunc();">
</form>
</body>

1. Вы, вероятно, имели в виду $("#text1")

2. У вас есть несколько ошибок в вашем примере, какое значение по умолчанию вы на самом деле ожидаете предотвратить?

3. Вы пытаетесь предотвратить отображение «случайного, раздражающего предупреждения»? Вы предполагаете, что myFunc() является значением по умолчанию, которое вы пытаетесь предотвратить?

4. Здесь все работает отлично: jsfiddle.net/mxt2B

5. @blgt но это не то, чего хочет OP…

Ответ №1:

Вы не можете использовать preventDefault для событий изменения, потому что это невозможно отменить:

 $("#text1").change(function(e) {
    alert(e.cancelable?"Is cancelable":"Not cancelable");
});

cancelable Свойство имеет значение true только для событий, которые можно предотвратить.

1. Большое спасибо. Иногда это очевидные вещи, которые являются наиболее проблематичными!

2. Итак, как это можно предотвратить?

3. @Triynko вы должны предотвратить событие, которое фактически изменяет входные value данные. change означает конец «сеанса ввода». Это указывает на то, что что-то произошло, а не на то, что что-то происходит . На момент change запуска значение value уже было изменено. Если вы хотите перехватить изменения value входных данных, вы должны предотвратить, например input , или click , в зависимости от типа ввода. С другой стороны, вы можете сохранить предыдущее значение входных данных в своем собственном управлении состоянием и самостоятельно восстановить значение после change события, если вы не хотите сохранять изменения.

Ответ №2:

preventDefault() используется для предотвращения поведения элемента по умолчанию, это поведение по умолчанию загружается в ваш браузер.

Например, поведение тега привязки при нажатии заключается в инициировании последовательности событий, которые изменят строку url и отправят http-запрос (я знаю слишком упрощенное объяснение).

Используя evt.preventDefault(evt) событие inside a click, вы можете остановить поведение по умолчанию, чтобы вы могли выполнять другие операции, прежде чем выполнять действия, или игнорировать все это вместе.

Проблема, которую я вижу в вашем примере, заключается в том, что поведение по умолчанию onchange заключается в том, чтобы отменить выбор поля ввода, не выделяя его, и я не уверен, что это классифицируется как событие (я почти уверен, что это не так). Не для того, чтобы он мог остановить подключенную вами функцию onchange() . Фактически, если бы вы использовали a preventDefault() , myFunc() это именно то, где оно должно быть.

Для предотвращения события должен быть результирующий результат, что-то помимо изменения внешнего вида. например, щелчок по тегу a, отправка формы, прокрутка контейнера.