Asp : FileUpload edit "파일을 선택하지 않았습니다"메시지

Question

메시지를 변경하려면으로 표시된 파일이 선택되어 있지 않으면 Asp:FileUpload으로 표시하면됩니다.

감사합니다.

Answer 1

자바 스크립트 CSS pseduo-class :after을 사용하여 자신 만의 메시지를 작성하십시오.

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

을 그리고 당신는 FileUpload 컨트롤에 할당 :이처럼 클래스를 선언 할 수 있습니다. 내용 메시지가 원래 메시지를 대체합니다.

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

데모 : : 물론 메시지를 제거해야 할 파일 선택에 따라, 당신은 jQuery를 .removeClass을 통해 예를 들어이 작업을 수행 할 수 있습니다 (귀하는 FileUpload의 가정 ID는 "foo는"입니다) http://jsfiddle.net/5zhuL/2/

참고이 그 솔루션은 Webkit-browser (Chrome, Opera, Safari)에서만 작동하는 것으로 보입니다. 다른 사용자에게는 대안이 필요할 수도 있습니다.

Answer 2

아니요. 이것은 Chrome의 표준 렌더링이며 변경할 수 없습니다.

Answer 3

브라우저에서 페이지 소스를 방문하면 ASP.NET에 입력 요소를 FileUpload 대신 type='file'으로 입력하십시오. 값 속성이 비어있을 때 CSS를 사용하여 텍스트를 덮을 수 있습니다.

Answer 4

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; 
} 

텍스트를 대체

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 5

코드에만이 CSS를 추가하십시오. 단순히 "No file selected"를 숨 깁니다.다른 솔루션에 비해

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

</style> 

Answer 6

http://jsfiddle.net/Lsgbx5ne/1/

input[type=file]{ 
    color:transparent; 
} 
input[type=file]:after { 
    color: #000; 
    content:" Cool!"; 
} 

개선 :

• 작품 짧은 텍스트
• 는

순수 CSS의 배경 색상을 변경하지 않습니다 모든 브라우저에서

Answer 7

이 작품

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

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

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