Asp:FileUpload 编辑“未选择文件”消息

Question

我只需要知道是否有办法更改未选择文件时显示的消息。Asp:FileUpload

谢谢。

Answer 1

http://jsfiddle.net/ZDgRG/

请参阅上面的链接。我使用 css 隐藏默认文本并使用标签来显示我想要的内容：

html

<div>
      <input type='file' title="Choose a video please" id="aa" onchange="pressed()">
      <label id="fileLabel">Choose file</label>
</div>

CSS

input[type=file]{
    width:90px;
    color:transparent;
}

javascript

window.pressed = function(){
    var a = document.getElementById('aa');
    if(a.value == "")
    {
        fileLabel.innerHTML = "Choose file";
    }
    else
    {
        var theSplit = a.value.split('\\');
        fileLabel.innerHTML = theSplit[theSplit.length-1];
    }
 };

Answer 2

您可以使用 CSS pseduo-class 将文本替换为您自己的消息:after。您可以声明一个像这样的类：

.bar:after {
    content:"Please select a file";
    background-color:white;
}

并将其分配给您的 FileUpload 控件。内容消息将取代原来的消息。当然，在选择文件时，您需要删除该消息，您可以通过 jQuery 执行此操作.removeClass（假设您的 FileUpload 的 ID 是“foo”）：

$('#foo').change(function() {
    $(this).removeClass("bar");
})

演示： http: //jsfiddle.net/5zhuL/2/

请注意，此解决方案似乎仅适用于 Webkit 浏览器（Chrome、Opera、Safari），您可能需要其他浏览器的替代方案。