iPhone'un Safari tetikleyicisi neden giriş türü = dosyadaki etkinliği değiştirmedi?

Question

Bir iPhone var ve gizli bir girişte change olayını yakalamanız gerekiyor. PC'de açıldığında işe yarıyor, ben changed metnini görüyorum. Bir iPhone'da açtığımda beklendiği gibi çalışmıyorsa, ben sadece open dialog'u görüyorum.

Basit jsfiddle demonstrates this.

<input type=file style="display:none" id=file> 
<button type=button id=but>open</button> 

<div id=out> 
</div> 

Ve nesi var

$(document).ready(function(){ 
    $('#but').on('click touchend', function(){ 
    $('#out').text('open dialog'); 
    $('#file').click(); 
    }); 
    $('#file').on('change', function(evt) { 
    $('#out').text('changed'); 
    }); 
}); 

? Yeni bir hata mı? Afaik, sadece bir ay önce çalıştı.

hidden'u opacity:0 ile değiştirmeyi denedim, basit jsfiddle için çalışıyor, ancak kenar çubuğunu gizleyerek karmaşık projede çalışmaz. Soru şu. Basit bir düzeltme ve son zamanlarda neler değişti (bazı Safari güncellemesi?), Gizli giriş davranışının değişmesine neden oldu?

Answer 1

, label ürününün for özelliğini kullanabilirsiniz. Aşağıdaki kodu sizin için faydalı olabilir: Dosyayı yüklerken label kullanılarak

$('#file').on('change', function() { 
 
    $('.button').text('changed') 
 
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input type='file' style='display:none' id='file'> 
 
<label for='file' class='button'>open</label>

, sen bazı mobil tarayıcılarda,

Ancak Yükleme düğmesi için özel bir stil kullanabilirsiniz Yine, dosya daha önce aynıysa, change olayını tetiklemez, dosyayı temizlemek için formreset yöntemini kullanırsınız:

o donukluk deneyin çalışırsa, hiçbiri css stil:

$('#file').on('change', function() { 
 
     $('.form')[0].reset() 
 
     $('.button').text('changed') 
 
    })

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<form class='form'> 
 
    <input type='file' style='display:none' id='file'> 
 
    <label for='file' class='button'>open</label> 
 
</form>