标签:date 预览 pos 地址 func eth main utf-8 ace
<!doctype html>
<head>
    <title></title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=0">
    <link rel="stylesheet" href="__STATIC__/layui/css/layui.css">
</head>
<body>
    {include file="public/header"}
        <div class="content">
            <div class="main-wrap">
                <form action="{:url(‘Index/insert‘)}" class="parsley-validate" enctype="multipart/form-data" method="post">
                <div class="form-group-col-2">
                    <div class="form-label">封面图</div>
                    <div class="form-cont">
                        <input type="file" name="img1[]"  placeholder="封面图" class="form-control form-boxed"  required=""  id="up-goods-btn"/>
                        <img id="img0" style="width: 150px">
                    </div>
                </div>
                <div class="form-group-col-2">
                    <div class="form-label"></div>
                    <div class="form-cont">
                       <input type="submit" class="btn btn-primary aaa" value="保存"/>
                    </div>
                </div>
            </div>
        </div>
        <!--form validation js -->
        <script src="__STATIC__/js/common/jquery.js"></script>
        <script src="__STATIC__/js/parsley.js"></script>
        <script src="__STATIC__/js/zh_cn.js"></script>
        <script src="__STATIC__/layui/layui.js"></script>
        <!--头像预览及上传-->
        <script>
            $("#up-goods-btn").change(function(){
                // getObjectURL是自定义的函数,见下面
                // this.files[0]代表的是选择的文件资源的第一个,因为上面写了 multiple="multiple" 就表示上传文件可能不止一个
                // ,但是这里只读取第一个
                var objUrl = getObjectURL(this.files[0]) ;
                // 这句代码没什么作用,删掉也可以
                // console.log("objUrl = "+objUrl) ;
                if (objUrl) {
                    // 在这里修改图片的地址属性
                    $("#img0").attr("src", objUrl) ;
                }
            }) ;
            //建立一個可存取到該file的url
            function getObjectURL(file) {
                var url = null ;
                // 下面函数执行的效果是一样的,只是需要针对不同的浏览器执行不同的 js 函数而已
                if (window.createObjectURL!=undefined) { // basic
                    url = window.createObjectURL(file) ;
                } else if (window.URL!=undefined) { // mozilla(firefox)
                    url = window.URL.createObjectURL(file) ;
                } else if (window.webkitURL!=undefined) { // webkit or chrome
                    url = window.webkitURL.createObjectURL(file) ;
                }
                return url ;
            }
            
        </script>
</body>
</html>
id要保持唯一性!!!
标签:date 预览 pos 地址 func eth main utf-8 ace
原文地址:https://www.cnblogs.com/mcll/p/9415779.html