zoukankan      html  css  js  c++  java
  • form submit提交遇到的问题

    因为公司业务需要,有一个提交的功能,提交的时候要上传文件,后端是用JAVA写的。用的是Form表单手动提交方式,如果用IE后台不到任何数据,firefox是可以的,但是不管是IE还是firefox,后台请求都会打开一个新的空白页面(速度很快时firefox看不出来)。而我想要的功能是提交完后就把当前页面关闭了,而不是打开一个新的空白页面。

    下面是html代码,当然经过我修改过的,把出错的情况和正确的都列出来了,submit1和submit2

     1 <!DOCTYPE html>
     2 <html>
     3 <body>
     4 <form  id="frmChild" enctype="multipart/form-data" onsubmit="return checkForm();">
     5  <input id="txtLocation"  name="locationvalue" type="file" size="50"/>
     6  <textarea cols="50" rows="5" id="comment" name="comment"></textarea>
     7 <input type="submit" name="submit" value="submit1"/>
     8 <button type="button" onclick="operator()">submit2</button>
     9 </form>
    10 </body>
    11 </html>

    1.IE浏览器提交 获取不到值的情况,即submit2,是在operator()方法中拼URL,然后手动提交,代码如下:

    function operator(){
        form.method="POST";
        form.action="/file/show-file?pid=" + pid + "&wid=" + wid ;   
        form.submit();    
    }
    

     这种方式iE提交后台取不到值,不知道具体原因是什么,问了一下公司的牛人,说:form表单存在上传文件的提交过程,会自动提交一些与表单相关的数据,比如表单头什么的,手动提交的话会出现不可预知的错误,更别提IE6了,最好的方法是在表单中submit直接自动提交。

    2.解决1的问题,既用submit1的方式。首先在form标签中写清楚method等信息,如:<form action="/file/submit-file" method="post" id="frmChild" enctype="multipart/form-data" onsubmit="return checkForm();">

    把要传的数据用<input type="hidden">隐藏在页面中,后台就可以一起获得数据了,不需要自己拼URL,在<form>中用onsubmit="return checkForm();"的原因是在提交之前要对表单数据进行一个验证,必须return一个值(true/false),如果返回的是false,表单就不提交了,如果return的是true,则表单继续自动提交。

    3.需要注意的点:

      (1).上传文件在表单中必须写明enctype="multipart/form-data",默认是"application/x-www-form-urlencoded"(没有上传文件时用),这是表单的MIME编码。有上传文件时不能用ajax请求提交数据 

       (2).表单提交到一个URL,默认会打开URL这个页面,不过不想打开这个页面的话,自动提交可能实现不了,为解决问题,可以在后端让页面跳转到一个想要的页面

  • 相关阅读:
    vi编辑器命令大全
    Ubuntu环境搭建svn服务器
    Visual Studio中“后期生成事件命令行” 中使用XCopy命令
    解决 Visual Studio For Mac 还原包失败问题
    [Win10应用开发] 如何使用Windows通知
    [Win10应用开发] 使用 Windows 推送服务
    如何使用 PsExec 执行远程命令
    如何在调试Window App时,触发 Suspending ,Resuming 等事件
    如何 “解决” WPF中空域问题(Airspace issuse)
    浅谈可扩展性框架:MEF
  • 原文地址:https://www.cnblogs.com/redangel/p/2812550.html
Copyright © 2011-2022 走看看