Javascript 单击“使用java脚本更改多个图像”，而不显示“为输入选择文件”字段

如果我不使用div作为输入字段，图像将发生变化，如第一幅图像所示。但是，我不想将该输入字段显示为ChooseFile，所以我为该输入字段编写了css。有人能帮我解决这个问题吗

HTML代码

我的剧本

像这样试试

<input type="file" id="file1" style="display:none" onchange="readURL()" />

<img src="something.jpg" onclick="$('#file1').click()"/> <!-- jquery -->

 <img src="something.jpg" onclick="document.getElementById("file1").click()"/>  <!-- javascript-->

#changepic{
    background: rgb(158, 158, 158);
    padding: 5px;
    width: 140px;
    margin: 0 auto;
    color: #fff;
    text-align: center;
}
.fileInput {
    cursor: pointer;
    height: 100%;
    position: absolute;
    top: 0;
    right: 0;
    z-index: 99;
    font-size: 50px;
    opacity: 0;
    -moz-opacity: 0;
    filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0);
}

<script>
    function readURL() {
        var $input = $(this);
        if (this.files && this.files[0]) {
            var reader = new FileReader();
            reader.onload = function (e) {
                $input.next('.blah').attr('src', e.target.result).show();
            }
            reader.readAsDataURL(this.files[0]);
        }
    }

    $(".imgInp").change(readURL);

</script>

<input type="file" id="file1" style="display:none" onchange="readURL()" />

<img src="something.jpg" onclick="$('#file1').click()"/> <!-- jquery -->

 <img src="something.jpg" onclick="document.getElementById("file1").click()"/>  <!-- javascript-->