fileinput使用注意事项 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>fileinput</title>
    <!-- 最新版本的 Bootstrap 核心 CSS 文件 -->
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
    <link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-fileinput/4.4.5/css/fileinput.min.css" media="all" rel="stylesheet" type="text/css" />
    <script src="https://code.jquery.com/jquery-3.0.0.min.js"></script>
    <!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-fileinput/4.4.5/js/fileinput.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-fileinput/4.4.5/js/locales/zh.js"></script>
    <style type="text/css">

    </style>
    <script>
        $(function () {
            /*shp文件导入功能*/
            $("#select-file").fileinput({
                language: 'zh', //设置语言
                theme: 'fas',
                uploadUrl: '', // 上传的地址
                uploadAsync:true, //是否为异步上传
                allowedFileExtensions: ['txt'],//接收的文件后缀
                showUpload: true, //是否显示上传按钮
                showCaption: true,//是否显示标题
                overwriteInitial: false,
                dropZoneEnabled: false,
                maxFileSize: 0,//单位为kb，如果为0表示不限制文件大小
                maxFilesNum: 0,
                allowedFileTypes: ['txt']
            }).on('fileerror', function(event, data, msg) {   //异步上传错误结果处理
                $("#select-file").fileinput('clear');    //重置选择框
            }).on('fileuploaded', function (event, data, previewId, index) {   //异步上传成功结果处理
                if(data.response.length > 0)
                {
                   //展示结果
                }else {
                    alert('数据格式不对，请重新上传!');
                    $("#select-file").fileinput('clear');    //重置选择框
                }
            }).on('filecleared', function(event, key) {   //文件被删除后执行的操作

            }).on('filebatchselected', function(event, key) { //文件被重新选择时执行的操作

            });
        });

    </script>
</head>
<body>
    <div class="file-loading">
        <!--一定要加上name='file'，否则发送的数据名默认为file_data，请求不到响应-->
        <input id="select-file" class="file"  name="file"  type="file"  data-show-preview="false">
    </div>
</body>
</html>

 

-------------------------------------------------------------------------------------------------

QQ群：871934478

版权所有，转载请注明源地址                          

-------------------------------------------------------------------------------------------------

posted @ 2020-04-24 12:36  一两米  阅读(322)  评论(0)  编辑  收藏  举报