无法使用 Jquery 更改其他容器图像

【问题标题】：Cant change other container images with Jquery无法使用 Jquery 更改其他容器图像
【发布时间】：2015-10-16 17:42:28
【问题描述】：

嘿伙计们我正在尝试制作更用户友好的附加图像输入文件和一个脚本，当人们选择某些东西时，我只更改第一个图像。知道如何解决吗？提前谢谢！

  $(function() {
     $("input:file").on(this).change(function (){
      $(this).parent().find('.empty_input_file').hide();
      $(this).parent().find('.full_input_file').show();
     });
  });

Check out example here

【问题讨论】：

标签： jquery html file input this

【解决方案1】：

您的输入具有相同的 ID，并且 ID **必须是唯一的*

jsFiddle example

<div class="image-upload" title="Select image">
    <label for="file-input1">
        <img class="empty_input_file" src="http://goo.gl/pB9rpQ" />
        <img class="full_input_file" src="http://zqapps.com/DraperDarkFlow/images/Icon-Blue.png" />
    </label>
    <input id="file-input1" type="file" name="d4p_attachment[]">
    <br/>
</div>
<div class="image-upload" title="Select image">
    <label for="file-input2">
        <img class="empty_input_file" src="http://goo.gl/pB9rpQ" />
        <img class="full_input_file" src="http://zqapps.com/DraperDarkFlow/images/Icon-Blue.png" />
    </label>
    <input id="file-input2" type="file" name="d4p_attachment[]">
    <br/>
</div>

【讨论】：