修改文件上传按钮 文本及样式

选中内容

<button style="padding: 10px; border-radius: 10px; color: white; background-color: #008de4;" type="button">上传文件</button> 
<span class="select_title">选中内容</span></p>
<script>
    $(function () {
        // button的单击事件
        $('.select_file').click(function () {
            // 启动文件选择
            $("#hiddenFile1").click();
            return false;
        });
        $("#hiddenFile1").change(function () {

            if ($(this).val() == "") {
                $('#file_val1').html("No file chosen");
                $(this).focus();
                return;
            } else {
                $('#file_val1').html($(this).val());
                $('.select_title').html(this.files[0].name)
            }
        })
        $("#hiddenFile1").blur(function () {

            if ($(this).val() == "") {
                $('#file_val1').html("No file chosen");
                $(this).focus();
                return;
            } else {
                $('#file_val1').html($(this).val());
                $('.select_title').html(this.files[0].name)
            }
        })
    });
    
</script>

 

 

 

posted @ 2022-03-27 16:10    阅读(276)  评论(0编辑  收藏  举报