表单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

回答

相关问题