$ ("form"). Submit (function() {Не работает в Firefox

Question

$("form").submit(function() { 
     if ($("#content") != null) { 
      $("#content").replaceWith('<div id="page-loader" class="fade in"><span class="spinner"></span><span class="spinner-text center">We are running as fast as our little ninja feet can go...</span></div>'); 
     } 
     return true; 
    }); 

Данное приложение отлично работает в Chrome, но не работает в Firefox. Не знаете, почему, но в Firefox форма фактически не отправлена. div заменяет работы, но нет любви на отправке, страница просто остается без дела.

Целью здесь является захват представления любой формы и набросание счетчика (CSS не изображение) на страницу до тех пор, пока сообщение/вернулся и вертушка вытерты от фактического содержимого DIV на перезагрузки страницы (без AJAX)

До:.

После:

Удален код (теперь появляется сообщение):

<form accept-charset="UTF-8" action="https://stackoverflow.com/users/sign_in" class="new_user" id="new_user" method="post" role="form"> 

  <!-- begin row --> 
      <div class="row"> 
       <!-- begin col-12 --> 
       <div class="col-lg-6"> 
        <div class="form-group"><label class="sr-only control-label" for="user_email">Email</label><input autofocus="autofocus" class="form-control" id="user_email" name="user[email]" placeholder="E-mail" type="email" value="" /></div> 
       </div> 
       <div class="col-lg-6"> 
        <div class="form-group"><label class="sr-only control-label" for="user_password">Password</label><input class="form-control" id="user_password" name="user[password]" placeholder="Password" type="password" /></div> 
       </div> 
      </div> 
      <!-- end row --> 
      <!-- begin row --> 
      <div class="row"> 
       <!-- begin col-12 --> 
       <div class="col-md-12 center"> 
        </br> 
       </div> 
      </div> 
      <!-- end row --> 
      <!-- begin row --> 
      <div class="row"> 
       <!-- begin col-12 --> 
       <div class="col-md-12 center"> 
        <input class="btn" name="commit" type="submit" value="Sign in" /> 
        <div class="m-t-20"> 

<a href="https://stackoverflow.com/users/password/new">Forgot your password?</a><br/> 

<a href="https://stackoverflow.com/users/confirmation/new">Didn&#39;t receive confirmation instructions?</a><br/> 

<a href="https://stackoverflow.com/users/unlock/new">Didn&#39;t receive unlock instructions?</a><br/> 

        </div> 
       </div> 
      </div> 
      <!-- end row --> 

<script> 
$(document).ready(function() { 
    App.init(); 

    $("form").submit(function(){ 
     if ($("#content") != null) { 
      $("#content").replaceWith('<div id="page-loader" class="fade in"><span class="spinner"></span><span class="spinner-text center">We are running as fast as our little ninja feet can go...</span></div>'); 
     } 
     return true; 
     alert("Submitted"); 
    }); 
}); 

$(function() { 
    var hash = window.location.hash; 
    hash && $('ul.nav a[href="' + hash + '"]').tab('show'); 
}); 

UPDATE:

Ok так я идиот, но по какой-то причине это не приходила мне в голову. Что происходит, так это то, что div #content включает форму, которую я заменяю. Итак, тайна для меня - это то, что работало в Chrome/IE, а не в Firefox?

Если я использую следующий он работает, но я получаю некоторые свисающие элементы формы:

$("form").submit(function(){ 
     if ($("#content") != null) { 
      $("#content").append('<div id="page-loader" class="fade in"><span class="spinner"></span><span class="spinner-text center">We are running as fast as our little ninja feet can go...</span></div>'); 
     } 
     return true; 
    }); 

Answer 1

Я советую вам установить тип входного представить и по щелчку, то вы можете выполнить свой код.

$("#submit_form_id").on("click", 
function(e){ 
e.preventDefault(); 

//your specific code 
$("#formId").submit(); 
}); 

И все будет хорошо!

Answer 2

попробовать это,

$(document).ready(function(){ 
    $("form").submit(function(){ 
if ($("#content") != null) { 
      $("#content").replaceWith('<div id="page-loader" class="fade in"><span class="spinner"></span><span class="spinner-text center">We are running as fast as our little ninja feet can go...</span></div>'); 
     } 
     return true; 
     alert("Submitted"); 
    }); 
});