用JS实现input中的file标签的样式（当要修改file标签的字体样式时使用）

实现步骤:1.创建一个input file标签，并设置该标签为隐藏的；

eg:<input type="file" id="file1" name="file1" style="display:none"/>

2.创建一个input text标签，来显示选中的文件路径；

eg:<input type="text" value="未选择文件" id="tex"/>

3.创建一个超链接标签，通过点击该链接间接点击了文件标签；

eg:<a οnclick="$('#file1').click()>选择文件</a>

4.通过一段JavaScript代码，将选中的文件路径显示在文本框中；

eg:<script>$(function(){ $("#file1").change(function(){ $("#tex").val($("#file1").val());});});</script>

注意:该段代码必须要加jQuery框架

完整代码如下:

<input type="file" id="file1" name="file1" style="display:none"/>
        <div class="input-append">
            <input id="filePath" class="input-sm" type="text" value="未選択ファイル" style="height:30px;font-size:13px;border-radius:5px">
            <a class="easyui-linkbutton" style="height:30px" οnclick="$('input[id=file1]').click();">選択ファイル</a>
        </div>    

 <script type="text/javascript">


        $(function () {
            $('input[id=file1]').change(function () {
                $('#filePath').val($(this).val());
            });
        });
        
    </script>