В любом случае, чтобы удалить "файл не выбран" из ввода типа = файла?

Ответ 1

Для этого нет кросс-браузерного способа. Текст "no file selected" находится в части виджета, определяемом реализацией, и я не считаю, что большинство браузеров значительно способствуют настройке браузера. С другой стороны, вы можете просто использовать CSS, чтобы покрыть текст чем-то, когда атрибут value пуст.

Ответ 2

input[type='file'] {
  color: transparent;
}

Enjoy

Ответ 3

Вы можете сделать это, указав ширину на вход и спрятав избыточное содержимое (нежелательный текст "Нет файла" ).

input {
    width: 132px;
    overflow:hidden;
}

Вот демонстрация на jsfiddle.

Остерегайтесь: каждый язык имеет свой собственный текст по умолчанию и может отображать разные размеры ввода. В бразильском португальском, что ширина 132px прекрасна!

Мой ответ был основан на fooobar.com/questions/51078/....

Ответ 4

Вы можете заменить поле файла кнопкой с ответом на этот вопрос: кнопка загрузки файла без поля ввода?

Ответ 5

CSS
<style>
#image_file{
   position: relative;
   width: 188px;
   border: 1px solid #BBB;
   margin: 1px;
   cursor: pointer;
   float: left;
  }
</style>

HTML
<input id="image_file" onclick="getFile()" onfocus="this.blur()" value=""/>
<div style='height: 0px;width: 0px; overflow:hidden;'>
    <input type="file" id="PinSpot_file">
</div>
<input type="button" onclick="getFile()" style="background-color: #DDD;" value="Browser" >


JAVASCRIPT
function getFile(){
   document.getElementById("PinSpot_file").click();
 }

// Event when change fields
$('#PinSpot_file').live('change', function(e) {     
  var file = this.value;
  var fileName = file.split("\\");
  document.getElementById("image_file").value = fileName[fileName.length-1];

   //AJAX
}

Ответ 6

Это действительно хороший хак, и он намного чище.

HTML

<div id="file_info' style='display:inline;'>Browse</div>
<input type="file" name='file[]' multiple style='opacity: 0;' onchange='displayFileName()'/>

JS

function displayFileName() {
    var files = $('input[type="file"]')[0].files;
    document.getElementById('file_info').innerHTML = files.length + " images to upload";`
}