Как сделать JQuery код выполняется в порядке

-4

У меня есть код:Как сделать JQuery код выполняется в порядке

<html> 
    <head> 
     <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script> 
     <script type="text/javascript"> 
      $(document).ready(function() { 
       $('form').submit(function(e) { 
        if (!$('.text').val()) { 
         e.preventDefault(); 
         console.log('error'); 
         return false; 
        } 
       }); 
      }); 
     </script> 
    </head> 
    <body> 
     <form> 
      <input type="text" class="text" value="" /> 
      <input type="submit" value="Send" /> 
     </form> 
     <script type="text/javascript"> 
      $('form').submit(function(e) { 
       e.preventDefault(); 
       $.ajax({ 
        url: 'send.php', 
        type: 'post', 
        success: function() { 
         console.log('done'); 
        } 
       }); 
      }); 
     </script> 
    </body> 
</html>

Я вставки в JavaScript в <head> и конец <body>.

Проблема заключается в том, что когда я нажимаю кнопку отправки, кажется, что браузер выполняет оба моих кода одновременно.

Я не хочу комбинировать оба кода в одном, я просто хочу выполнить код javascript на <head>, остановился, если произошла ошибка, иначе он выполнил бы код в <body>.

Если вы просто взгляните на мою проблему и поделитесь своей наукой, я был бы очень благодарен. Благодаря!

источник

2015-04-29 UserNaN

Один в теле всегда будет первым в этом случае, потому что он сначала связан, а просто FYI. –

Чтобы остановить все будущие обработчики событий для текущего события, вы хотите остановитьImmediatePropagation, а также preventDefault. –

Почему вы не комбинируете оба сценария? –

JQuery будет выполнять обработчики событий в том порядке, в котором они привязаны, но, как отметил @KevinB в комментарии, один в <body> связан сначала, потому что этот код выполняется, поскольку он встречается, а тот, <head> связан вторым, потому что он выполняется во время события, готового для страницы.

Вы можете изменить порядок кода, чтобы оба обработчика были связаны в правильном порядке, а затем используйте e.stopImmediatePropagation() в первом обработчике, если вы хотите предотвратить выполнение второго, но было бы лучше связать только один обработчик.

Просто поместите один <script> блок в <head > и свяжите один отправителем.

<script type="text/javascript"> 
    $(document).ready(function() { 
     $('form').submit(function(e) { 
      if (!$('.text').val()) { 
       e.preventDefault(); 
       console.log('error'); 
       $.ajax({ 
        url: 'send.php', 
        type: 'post', 
        success: function() { 
         console.log('done'); 
        } 
       }); 
      } 
     }); 
    }); 
</script>

источник

2015-04-29 19:40:38

Спасибо, я вставляю код в верхнюю часть тега 'body', не включаю' $ (document) .ready() '... моя проблема решена! – UserNaN

при использовании

.submit (обработчик)

связывание обработчика события на самом деле вы связывающие два обработчика.

, если вы хотите, чтобы отправить форму после проверки вы можете проверить, а затем простой

.submit()

, который отличается по с JQuery документации https://api.jquery.com/submit/

источник

2015-04-29 19:52:10

Спасибо за ответ – UserNaN

Как сделать JQuery код выполняется в порядке

ответ

Смежные вопросы