jquery.imageuploader.js多文件上传js插件


 jquery.imageuploader.js多文件上传js插件

第一步引入bfwone

第二步执行插件

示例如下

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>BFW NEW PAGE</title>
    <script id="bfwone" data="dep=jquery.17&err=0" type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/bfwone.js"></script>
    <script type="text/javascript">
        bready(function() {
            use(["jquery.imageuploader", "imageuploader"], function() {
                var options = {};
                $('.js-uploader__box').uploader({
                    'selectButtonCopy': '请选择或拖拽文件',
                    'instructionsCopy': '你可以选择或拖拽多个文件',
                    'submitButtonCopy': '上传选择的文件',
                    'furtherInstructionsCopy': '你可以选择或拖拽更多的文件',
                    'secondarySelectButtonCopy': '选择更多的文件'
                });
            });
        });
    </script>
</head>
<body>
    <div class="htmleaf-container">

        <section role="main" class="l-main" style="margin-top:50px;margin-bottom:50px;">
            <header class="site-header">
                <h1 class="site-title l-site-title" style="font-size:1.2em;">jquery多文件上传插件效果演示</h1>
            </header>
            <div class="uploader__box js-uploader__box l-center-box">
                <form action="#" method="POST">
                    <div class="uploader__contents">
                        <label class="button button--secondary" for="fileinput">请选择文件</label>
                        <input id="fileinput" class="uploader__file-input" type="file" multiple value="Select Files">
                    </div>
                    <input class="button button--big-bottom" type="submit" value="Upload Selected Files">
                </form>
            </div>
        </section>
    </div>


</body>
</html>


立即下载jquery.imageuploader.js查看所有js插件

网友评论0

程序员在线工具箱