試圖在表單上顯示一個元素提交

Question

我試圖顯示一個loader.gif圖像，當我的表單submited。

我的loader.gif在CSS中有display:none，我想在表單被引用時顯示它。 我想用下面的簡單代碼來做到這一點。

對我來說這似乎是正確的，但它不工作。

你在這裏看到錯誤嗎？

的jQuery：

$(function(){ 
    $('form').submit(function(){ 
     $('.loginbox h1 img').fadeIn('fast'); 
    }); 
}); 

CSS：

.loginform h1 img { 
    float:right; 
    margin:7px 0; 
    display:none; 
} 

HTML：

<h1>Login Form: <img src="img/loader.gif"/></h1> 
<form name="login" action="" method="post"> 
    <label> 
     <span>User:</span> 
     <input type="text" name="user" /> 
    </label> 

    <div class="label"> 
     <span>Pass:</span> 
     <input type="password" name="pass" /> 
     <input type="submit" value="Login"/> 
    </div>   
</form> 

Answer 1

我想這是因爲，一旦它被提交，則回發或重裝或重定向。

你可以這樣做：

$(function(){ 
    $('form').submit(function(e){ 
     e.preventDefault(); // prevents submission 
     $('h1 img').fadeIn('fast'); // since you aren't using that class 
     $.ajax({ ... }); // use ajax to submit the form 
    }); 
});