jQuery上传文件

1.引入资源

<script src="/yami/backend/backres/js/jquery.min.js"></script>

<script src="/yami/backend/backres/js/jquery.ui.widget.js"></script>
<script src="/yami/backend/backres/js/jquery.iframe-transport.js"></script>
<script src="/yami/backend/backres/js/jquery.fileupload.js"></script>

2.在form中加入
<input type="file" name="excel" id="fileupload" style="display:none" onclick="upload()" multiple/>
<a href='' onclick="document.getElementById('fileupload').click();return false;">
    <div class="batch">批量导入用户手机号</div>
</a>

点击a标签触发<input>点击事件
 //选择文件后自己主动上传
    function upload() {
        $('#fileupload').fileupload({
            url: "/yami/backend/coupon.getPhonesFromExcel.do",
            dataType: 'json',
            add: function (e, data) {
                var goUpload = true;
                var uploadFile = data.files[0];
                if (!(/\.(xls||xlsx)$/i).test(uploadFile.name)) {
                    alert('请选择excel文件!');
                    goUpload = false;
                }
                if (uploadFile.size > 2000000) { // 2mb
                    alert('上传文件大小不得超过2M');
                    goUpload = false;
                }
                if (goUpload == true) {
                    data.submit();
                }
            },
            done: function (e, data) {
                document.getElementById("showPhones").innerHTML = "<p>成功上传" + data.result.length + "手机号!!!</p>";
                document.getElementById("phoneList").setAttribute("value", data.result);
            }
        });
    }

posted @ 2016-04-22 19:15  mengfanrong  阅读(1984)  评论(0编辑  收藏  举报