首页 > Web开发 > 详细

Bootstrap文件上传组件:bootstrap fileinput前端

时间:2016-08-10 14:07:43      阅读:330      评论:0      收藏:0      [点我收藏+]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
     
    <link href="BootstrapFileInput/css/fileinput.min.css" rel="stylesheet" type="text/css" />
    <link href="BootstrapFileInput/css/fileinput.css" rel="stylesheet" type="text/css" />
    <link href="bootstrap-3.3.5-dist/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
    <script src="../Scripts/jquery-1.8.3.min.js" type="text/javascript"></script>
    <script src="BootstrapFileInput/js/fileinput.js" type="text/javascript"></script>
    <script src="bootstrap-3.3.5-dist/js/bootstrap.min.js" type="text/javascript"></script>
     <script src="BootstrapFileInput/js/locales/zh.js" type="text/javascript"></script>
 <script type="text/javascript" src="BootstrapFileInput/js/fileinput_locale_zh.js"></script>

 

</head>
  <body>
        <div class="container kv-main">
            
            <br>
            <form enctype="multipart/form-data">
                
                <div class="form-group">
                    <input id="file-1" type="file" multiple class="file" data-overwrite-initial="false" data-min-file-count="2">
                </div>
                
            </form>
        </div>
    </body>
    <script>

        $("#file-1").fileinput({
            language: zh, //设置语言
            uploadUrl: #, // you must set a valid URL here else you will get an error
            allowedFileExtensions: [jpg, png, gif, pdf], //接收的文件后缀
            overwriteInitial: false,
            maxFileSize: 1000,
            maxFilesNum: 10,
            //allowedFileTypes: [‘image‘, ‘video‘, ‘flash‘],
            slugCallback: function (filename) {
                return filename.replace((, _).replace(], _);
            }
        });
   
    </script>
</html>

 

Bootstrap文件上传组件:bootstrap fileinput前端

原文:http://www.cnblogs.com/panjinzhao/p/5756405.html

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