首页 > Web开发 > 详细

input文件上传,修改样式以及限制文件格式

时间:2015-10-22 10:22:24      阅读:276      评论:0      收藏:0      [点我收藏+]
<form id="importForm" class="form-horizontal" action="../image/uploadimg.shtml" method="post" enctype="multipart/form-data" style="margin:0;">
     <div class="textfile-box" style="display:inline-block;margin-right:5px;position:relative;">
        <input type=‘text‘ style="width:140px;" readonly name=‘textfield‘ id=‘textfield‘ class=‘txt‘ /> 
        <input type=‘button‘ class=‘btn btn-primary‘ value=‘浏览..‘ /> 
        <input type="file" style="position:absolute;width:70px;right:0;opacity:0;alpha(opacity=0);" id="myfile" name="myfile" required accept=".csv" onchange="document.getElementById(‘textfield‘).value=this.value"  />
      </div>
      <input type="submit" name="submit" id="submitBtn" class="btn btn-warning" value="导入文件" />
</form>    
<div class="import-result">
   <p class="result-text">请导入数据,<span style="color:#f0ad4e;">(注意:导入的文件格式为.csv)</span></p>
</div>
//导入文件
        $("#importForm").on(‘submit‘, function(e) {
            e.preventDefault(); 
            $(‘#importForm‘).ajaxSubmit({
                success : function(data) {
                    if (data.flag == 1) {
                        $(".result-text").addClass("success-text").removeClass("error-text").html("导入成功,<a href=‘/jxs/jsp.shtml?dir=people/student/train-import-list‘>查询导入数据</a>");
                    } else {
                        $(".result-text").addClass("error-text").removeClass("success-text").html("导入失败<br/>"+data.msg);
                    }
                }
            });
            return false;
        });

 

input文件上传,修改样式以及限制文件格式

原文:http://www.cnblogs.com/fangdx/p/4899933.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!