JavaScriptを使用してファイルアップロードを実行するためのドロップダウン

Question

誰かが「グラスを追加」をクリックしたときにファイルのアップロードを開始しようとしています これは私がやったことであり、動作しません。

$('select[name="dropdown"]').change(function(){ 
 

 

 

 
    if ($(this).val() == "4"){ 
 
     $('input[type=file]').trigger('click'); 
 

 
    }  
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<td><select name="dropdown" size=1> 
 
    <option value="1">Select</option> 
 
    <option value="4">Add Glass</option> 
 
    </select>​</td> 
 
    <input type="file" name="file" id="file" style="display: none;" accept="image/*">

Answer 1

それが動作します選択するとちょうどあなたが変更イベントで使用しているので...イベントは、あなたが選択オプションを変更する場合にのみ動作します....オプションを追加...

$('select[name="dropdown"]').change(function(){ 
 

 

 

 
    if ($(this).val() == "4"){ 
 
     $('input[type=file]').trigger('click'); 
 

 
    }  
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<td><select name="dropdown" size=1> 
 
<option value="1">Select</option> 
 
<option value="4">Add Glass</option> 
 
</select>​</td> 
 
<input type="file" name="file" id="file" style="display: none;" accept="image/*">

Answer 2

あなたが変更イベントが呼び出されないように、オプションを1つだけ持っています。

あなたは、選択ボックスの上部に空のオプションを追加するか、おそらく-Select-だけのオプションを追加する必要があります。

$('select[name="dropdown"]').change(function(){ 
 
    if ($(this).val() == "4"){ 
 
    $('#file').trigger('click'); 
 
    }  
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<td> 
 
<select name="dropdown" size=1> 
 
    <option value="">-- Select --</option> 
 
    <option value="4">Add Glass</option> 
 
</select> 
 
</td> 
 
<input type="file" name="file" id="file" style="display: none;" accept="image/*">