• 实现无选择框的上传和无打开窗口的下载


    效果说明:实现无文件选择框上传,无弹出框下载,上传过程中上传按钮禁用

    1、按钮页面:

    HTML代码

    <div >
        <button  icon='upload' id='uploadBt' onclick='doUpload()'>上传</button>
    
        <button  icon='download' id='downloadBt' onclick='doNowDownload()'>下载</button>
    </div>
    
    <div style="display:none">
    <iframe id="downloadFrame" name="downloadFrame" src='' width="10" height="10"></iframe>
    </div>
    <div style="display:none">
      <iframe id="uploadFrame" name="uploadFrame" src='DisplayUploadFile.do?sbcode=${sbcode}' width="10" height="10"></iframe>
    </div>

    JS代码

    //上传下载
    var isClick = true;
    function doUpload(){
      if(isClick){
        document.uploadFrame.uploadForm.myfile.click();
      }else{
        alert("正在上传中,请稍候!");
      }
    } 
    //文件下载
    
    function doNowDownload(){
      var id = getChoiceRowID();
      if(id){
        document.getElementById("downloadFrame").src='<of:ActionTag action="downloadFile.do"/>' + '?id=' + id;
      }
    }

    2、隐藏起来的带有文件选择框的JSP页面

    <%@page contentType="text/html;charset=utf-8"%>
    <html>
    <body>
      <form name="uploadForm" method="post" id="uploadForm" target="DummyFrame" action="UploadFile.do" enctype="multipart/form-data">
        <input type="file" name="myfile" id="myfile" onchange="javascript:doSubmit(this)"/>
      </form>
      <iframe name="DummyFrame" frameborder=0 width='0' height="0" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" style="border: 0px #CCCCCC solid" src=""></iframe>
    </body>
    <script>
    function doSubmit(obj){
      var filename = obj.value;
      if(""!=filename){
        parent.window.isClick = false;
        parent.window.document.getElementById("uploadBt").disabled = true;
        document.getElementById("uploadForm").submit();
      }
    }
    </script>
    </html> 

    3、结果显示页面

    <%@page contentType="text/html;charset=utf-8"%>
    <script>
    var isOk = "${isOk}";
    var sbcode = "${sbcode}";
    var ele = '<input type="hidden" name="sbcode" value="' + sbcode
    + '" /><input type="file" name="myfile" id="myfile" onchange="javascript:doSubmit(this)"/>'; //重写控件,下次选择同一文件时onchange事件才能被调用
    parent.document.getElementById("uploadForm").innerHTML = ele;
    parent.parent.window.isClick = true;
    parent.parent.window.document.getElementById("uploadBt").disabled = false;
    alert("${msg}");
    if(isOk){
      parent.parent.window.doSearch();
    }
    </script>
  • 相关阅读:
    OC
    OC
    OC
    OC
    OC
    Oracle wm_concat()函数
    字符串拼接
    easyui扩展数据表格点击加号拓展
    子tab里面新增tab(top.jQuery)
    combox datagrid重复请求问题
  • 原文地址:https://www.cnblogs.com/yangzhilong/p/2880101.html
Copyright © 2020-2023  润新知