隠し入力とカスタムラベルの同じ動作を与える方法

Question

style = "display：none;"でファイルタイプ入力ボタンと同じ動作を与える方法カスタムラベルに？つまり、入力が隠されていても、ラベルと入力は同じアクションを持つことができます。私のhtmlコードの下 ：

<label for="model1" class="uploadFile">File...</label> 
<input id="model1" type="file" name="model1" class="model1" style="display:none;" required="true" /> 

Answer 1

それはjQueryを使って非常に簡単です：

$('#model1Label').on('click', function(){ 
 
    $('#model1').triggerHandler('click'); 
 
    
 
    //seems not to work consistently on chrome (only for file inputs?) 
 
    //$('#model1').trigger('click'); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<label id="model1Label" for="model1" class="uploadFile">File...</label> 
 
<input id="model1" type="file" name="model1" class="model1" style="display:none;" required="true" />

EDIT：SKSpallにより示唆されるように、時の奇妙な行動のためのトリガ機能を修正最小クロム