如何动态更改输入类型文件的标题？

Question

我想实现不同类型的输入文件，所以我使用了css和html选项来更改默认输入文件。所以我有以下HTML代码：

<div class="fileinputs">&nbsp;
<input type="file" class="file" id="file" name="file" title="There aren't any files chosen yet." style="width:270px;"/>
<div class="fakefile">
<input tyle="button" name="button" value="Choose the file you want (click)" />
</div>
</div>

然后，CSS代码：

div.fileinputs {position: relative;}
div.fakefile {
            position: absolute;
            top: 0px;
            left: 0px;
            z-index: 1;
             }
input.file {
            position: relative;
            text-align: right;
            -moz-opacity:0 ;
            filter:alpha(opacity: 0);
            opacity: 0;
            z-index: 2;
           }

一切看起来都很好，当我将鼠标悬停在输入上时，它会显示我用html编写的标题。但我希望它在我选择一个文件后更改，以显示我选择的文件的名称。我怎样才能做到这一点？提前谢谢。

Answer 1

试试这段代码：

<强> DEMO

<强> JS ：

 $('input').change(function(){
       $(this).attr('title',($(this).val()));
    });