FileUpload нажмите событие оленьей кожи уволит должным образом после применения определенных стилей CSS (на IE 8)

Question

У меня есть следующие

Asp.net Markup

<div class="formSample"> 
     <div class="uploadTest"> 
      Choose File 
     <asp:FileUpload ID="uploadControl" runat="server" /> 
     </div>   
</div> 

СОРТ

.formSample

{ 
    display: inline-block; 
    float: right; 
    width: 22em; 
    margin-top: 0.3em; 
} 

.uploadTest

{ 
    font-family: 'open_sansregular', Arial, Helvetica, sans-serif; 
    float: right; 
    overflow: hidden; 
    width: 9em; 
    text-align: center; 
    color: white; 
    font-size: 1em; 
    background: #22a0db; 
    cursor: pointer; 
    padding: 0.4em 0.2em 0.1em 0.3em; 
    margin: 0em 0em; 
    border-radius: 1em; 
    -webkit-border-radius: 1em; 
    -moz-border-radius: 1em; 
    -ms-border-radius: 1em; 
    -o-border-radius: 1em; 
} 

Javascript

function upLoadOnClick() { 
     document.getElementById('ctl00_ContentPlaceHolder1_uploadControl').parentNode.click(); 
    } 

     document.getElementById('ctl00_ContentPlaceHolder1_uploadControl').onClick = upLoadOnClick; 

Проблема здесь, когда я нажимаю управление на правой стороне, то только всплывающий появляюсь, но когда я нажимаю контроль на среднем или левое окно просмотра оленьей кожи вспылить. Эта проблема возникает только в IE8. Любые предложения?

Заранее спасибо

Answer 1

Прежде всего, большинство (и, вероятно, все современные браузеры) не позволяют программные щелчки file входов по соображениям безопасности, так что ваш Javascript не будет работать так, как вы хотите. Чтобы получить всплывающее окно выбора, пользователь должен щелкнуть элемент управления самостоятельно. Ваш код как есть без javascript, кажется, работает как ожидалось для меня как в Chrome, так и в Firefox. Вот fiddle.

Входной файл file, как известно, трудно настроить в браузерах. Самый распространенный подход, который я считаю, - сделать файл невидимым и наложить его поверх других элементов, которые стилизованы так, как вы хотите, чтобы они выглядели. Вот еще один пример fiddle.