Jquery onchange函数不会在隐藏文件控件上调用

Question

我想在选择文件或文件更改时调用onchange函数，但我的onchange函数没有被调用，因为我已经设置了display：none用于文件控制，因为我在图像点击时使用调用它，我无法理解在onchange函数上调用它：

 $(document).ready(function() { $('#profile-image').on('click', function() { $('#photo').click(); // opens up the file dialog for selection of image }); }); $("#photo").change(function() { alert($(this).val()) }); 

 .hidden_img { display: none; } 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> <input class="hidden_img" type="file" name="imagefile" id="photo"/> <img src="images/btn.jpg" width="148" height="60" alt="btn" id="profile-image"> 

Answer 1

请检查下面的解决方案，它工作正常;

 $(document).ready(function() { $('#profile-image').on('click', function() { $('#photo').click(); // opens up the file dialog for selection of image }); }); $("#photo").on('change',function() { alert($(this).val()) }); 

 #photo{ display:none; } 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> <input class="hidden_img" type="file" name="imagefile" id="photo" /> <img src="http://placehold.it/148X60" width="148" height="60" alt="btn" id="profile-image">