表單onSubmit與Javascript不能正常工作在IE和Firefox

好吧，我剛纔提交了一個問題，關於一個動畫加載GIF不顯示圖像上傳（PHP）時。現在，我設法讓圖片上傳時顯示GIF，但在IE和Firefox中，加載GIF永遠不會消失（和/因爲？）表單永遠不會提交。在Chrome中，GIF消失，表單提交。下面是我做吧..表單onSubmit與Javascript不能正常工作在IE和Firefox

<!-- Validates form --> 
<script type="text/javascript" src="jquery-1.8.0.js"></script> 
<script> 
function validationloading(){ 
    // post box blank 
    var x=document.forms["livefeed"]["message"].value; 
    if (!$.trim($("#styled").val())){ 
     document.livefeed.message.focus(); 
     document.livefeed.message.style.border="solid 1px red"; 
     alert("Cannot post a blank message."); 
     return false; 
    } 

    document.write("<table cellpadding='0' cellspacing='0' border='0' align='center' width='100%' height='130'><tr><td align='center' valign='center'><img src='images/ajax_loader.gif' width='50' height='50'></td></tr></table>"); 
    return true 
    $("#myform").submit(); 
} 
</script>

下剪斷就是從形式調用它..

onSubmit="javascript: validationloading()"

我已經試過周圍洗牌返回真值，並將其改變結果，但不是我需要的方式。它會在IE和Firefox中提交，但不顯示加載GIF。我知道我的代碼是一堆斜坡，但這就是我來這裏的原因。

以下在三種瀏覽器中都能100％地工作......感謝所有的幫助！

<!-- validates form and displays loading gif --> 
<script type="text/javascript" src="jquery-1.8.0.js"></script> 
<script> 
function validationloading(){ 
    // post box blank 
    var x=document.forms["livefeed"]["message"].value; 
    if (!$.trim($("#styled").val())){ 
     document.livefeed.message.focus(); 
     document.livefeed.message.style.border="solid 1px red"; 
     alert("Cannot post a blank message."); 
     return false; 
    } 
    // 

    document.livefeed.submit(); 
    document.getElementById("gif_block").style.display="block"; //gif_block is the id of the div outside the image 
    document.getElementById('livefeed').style.display ='none'; 
    return true; 

} 
</script>

和GIF DIV是這個..

<div id="gif_block" style="display:none" align="center" ><p><image src="images/ajax_loader.gif" id="loader-img" width="50" height-"50" /></p></div>

來源

2012-11-05 user1799250

好的，我希望我可以接受這兩個..我接受了一個答案。感謝您的高舉。 – user1799250

有幾件事你的代碼錯誤：

javascript:僅在href或action屬性有意義的 - 基本上，無論你可能會發現一個網址。這是一個表示要運行的JavaScript代碼的方案。在事件處理程序或<script>標記中，它只是您可能用作循環的一部分的標籤。
return總是結束當前塊的執行，因此它對return true絕對沒有意義，然後嘗試$("#myform").submit();。
事實上，$("#myform").submit()有潛在的危險，因爲它可能會導致無限循環：通過在自己的onSubmit處理程序中提交表單，再次觸發處理程序並嘗試重新提交表單，依此類推。
document.write()將覆蓋整個頁面，如果頁面加載時未被調用。在這種情況下，這並不是一個太大的問題，但我相當確定這不是你打算做的事情。
document.forms已過時，您應改爲使用適當的DOM方法，如getElementById。但是在這種情況下，您可以將this作爲參數傳遞給validationloading，它將引用正在提交的表單。我假設這與爲什麼你有document.livefeed.message - 使用getElementById這些相似。
你實際上從來沒有對函數的返回值做任何事情。你需要return它的堆棧：onSubmit="return validationloading();"

的頭號問題是document.write的事情。刪除它和.submit()後，一切都會好起來的。除非您使用AJAX，否則無需添加「加載」GIF。

來源

2012-11-05 18:31:29

我真的很感激你發佈的信息，但你告訴我沒有必要添加加載GIF ..？我調整了我的PHP。ini接受更大的圖像文件（我寫了PHP代碼來調整和壓縮他們..）。當有人上傳大圖時，最多可能需要30秒。我只想要一個動畫加載GIF在圖像上傳時顯示，因此它們不會開始刷新頁面等。「 – user1799250

*」通過在自己的'onSubmit'處理程序中提交表單，您再次觸發處理程序並嘗試重新提交表單，等等。「*以編程方式提交表單不會觸發'onsubmit'處理程序。 –

@ user1799250：不，他/她告訴你'document.write'不是添加它的正確方法。 –

有幾個問題有：

如果你想通過validationloading防止其提交返回值，則需要添加return即可：
```
onsubmit="return validationloading()" 
```
這是因爲在最封面，則瀏覽器上面的處理函數，看起來是這樣的：
```
function(event) { 
    // ...your code here... 
} 
```
...並使用該函數的返回值。
如果您在加載頁面使用document.write，整個頁面內容被殲滅和在document.write取代與你的輸出。如果這會干擾表單提交，我不會感到驚訝。 document.write在網絡應用程序中基本上沒有位置，並且在過去的12年內沒有這樣的位置。 :-)使用DOM對象和方法將元素添加到頁面，和/或更改它們的樣式，以便隱藏一些並顯示其他元素。（在你最喜歡的搜索引擎上搜索一下應該會給你很多的工作。）
你有永遠不可能達到的代碼：在return true之後調用submit。
```
return true 
$("#myform").submit(); // <== This code will never run 
```
return退出函數，所以它後面的代碼將永遠不會運行。

其他說明（這幾乎肯定是不問題）：

隨着onxyz處理器屬性，您不使用javascript:僞協議。他們的內容是已經 JavaScript。您只在預期使用URL的地方使用javascript:，與鏈接上的href一樣。但是，它通常不會導致錯誤，因爲它看起來像JavaScript引擎的labelled statement。
正確的屬性名稱全部小寫。但是，如果你在做XHTML，那麼它就很重要，所以對你來說可能沒有關係。

來源

2012-11-05 18:29:14

是的，謝謝，我只是爲了在語法上正確而做了編輯。雖然IE和Firefox的問題仍然存在 - GIF堅持，並且表單不能提交。 – user1799250

@Teemu：謝謝，我甚至沒有讀到那麼遠！更新。幾個問題... –

@ user1799250：還有其他問題，請參閱上面的更新。 –

表單onSubmit與Javascript不能正常工作在IE和Firefox

回答

相關問題