Блог

#javascript #forms #submit

#javascript #формы #Отправить

Вопрос:

 <form name="form1">
    <cfinput type="text" name="text1" id="text1" onChange="someFunc();">
</form>
  

 <script>
function someFunc() {
    if (1==2) {
    document.form1.submit();
} else {
            alert("Not submitting");
    }
</script>
  

Комментарии:

1. Предложение Digital Chris будет работать, но это не «лучшая практика». Посмотрите на метод event.preventDafault() jQuery, если вы идете по этому пути, и ваш скрипт отправляет форму, когда проверка возвращает true . Но я все же предлагаю посмотреть на мой ответ ниже.

2. Большое спасибо за ваши полезные предложения. 1. Я не вижу ответа Digital Chris. 2. Я пытался использовать preventDefault(), но это не сработало. 3. Почему «По умолчанию» для ввода текста установлено значение отправки формы? Атрибут onChange() (единственный указанный атрибут действия) указывает на мою функцию someFunc() , которая не вызывает document.form1.submit() , так ГДЕ ЖЕ В МИРЕ код получает представление о том, что форма должна быть отправлена? Заранее большое спасибо за разъяснения!

Ответ №1:

 <form name="form1" onsubmit="return someFunc()">
    <input type="text" name="text1" id="text1">
</form>  

 <script>
function someFunc() {
    if (1==2) {
        return true;
    } else {
        alert("Not submitting");
        return false;
    }
}
</script>  

 $(document).ready(function(){ 
    $("#text1").on('change', function(event){ 
        event.preventDefault(); 
    }); 
});  

 $(document).ready(function(){ 
    $("#form1").submit(function(event){ 
        event.preventDefault(); 
    }); 
});  

 $(document).ready(function(){ 
    $("#form1").submit(function(event){ 
        if ( $('#text1').val() !== "foo" ) {
            alert("Error");
            event.preventDefault(); 
        }
    }); 
});  

Комментарии:

1. Большое спасибо за ваш ответ. Тем не менее, у меня все еще есть несколько вопросов: 1. почему форма отправляется только потому, что я нажал enter при вводе текста? Разве он не должен отправляться только в том случае, если выполняется команда document.form1.submit()? 2. Я не вижу фундаментального недостатка в подходе, так как разве не вполне допустимо не иметь кнопки отправки? Мне не нужна кнопка отправки. Я хочу отправлять только при изменении текстового поля и только тогда, когда текст действителен. Большое спасибо за ваш отзыв!

2. Форме не нужна кнопка отправки. Большинство браузеров отправляют формы, когда вы нажимаете enter внутри ввода. Возьмем, к примеру, эту форму комментария: когда я закончу печатать, я могу нажать «Добавить комментарий» или просто нажать клавишу ввода, и форма отправится. Можно перехватить событие нажатия клавиши события и остановить отправку формы, но это используется не часто, поскольку это может помешать рабочему процессу пользователя. Событие отправки, которое может быть определено в теге формы с помощью атрибута «onsubmit», запускается при отправке формы.

3. Большое спасибо. Это полезно, но где форма получает представление о том, что она должна отправляться только потому, что введена клавиша ввода? Я этого не указывал. Я только указал, что onChange() должен указывать на someFunc() . Если бы у меня не было атрибута onChange(), то форма не думала бы о отправке только потому, что я нажал Enter при вводе текста. Вы имеете в виду, что каждый раз, когда у вас есть атрибут onChange(), Coldfusion (или Javascript) будет автоматически привязываться к отправке?

4. Это не имеет ничего общего с ColdFusion, это основная функциональность HTML. onChange запускается только после того, как курсор покидает этот конкретный ввод и значение этого ввода изменилось. Нажатие enter при любом вводе текста автоматически запускает отправку формы во всех основных браузерах. Я добавил ссылку на спецификацию HTML, специально для отправки формы, в свой ответ.

5. Понял. Это очень полезно. Есть идеи, почему следующее не работает?: $(document). готово(функция(){ $(«#text1»).onchange(функция(событие){ event.preventDefault(); }); });

Ответ №2:

  var form = document.getElementById("Your Form ID");

 form.addEventListener("submit", function (e) {
      if ("Your Desired Conditions.") {
          e.preventDefault();
      }
 });
  

Ответ №3:

 <form onsubmit="return false;" >