文件上传按钮样式美化，显示图片路径

最新推荐文章于 2021-12-31 19:41:53 发布

荷兰豆der

最新推荐文章于 2021-12-31 19:41:53 发布

阅读量853

点赞数

分类专栏： thinkcmf HTML

本文链接：https://blog.csdn.net/sinat_35788325/article/details/53517741

版权

HTML 同时被 2 个专栏收录

2 篇文章 0 订阅

订阅专栏

thinkcmf

1 篇文章 0 订阅

订阅专栏

隐藏input file按钮，用同级button代替，并在button后面显示图片信息

$('#addimg').click(function () {
            $('input[name="path"]').click();
        });
        $('input[name="path"]').on('change',function(){
            var image=this.files;
            $('#imge').html(image[0].name);
        });

<div class="control-group">
                <label class="control-label">广告图片:</label>
                <div class="controls">
                    <button class="btn btn-primary" id="addimg" type="button">选择图片</button>
                    <input type="file" style="display: none;" name="path"/>
                    <span id="imge"></span>
                    <span class="form-required">*</span>
                </div>
            </div>