Jquery .attr（）无法更新输入字段的名称[关闭]

Question

Following is my html code where i am calling a function to delete the selected image which gets store in name property of input tag.

<input id="im1" type="file" name ="upimage1" onchange="readURL(this);" class="upload" required/>
            <span class="trash-area1" id="im1" onclick="readUR(this)"><img class="trash-box" src="img/trash.png" width="24px" height="24px"></span>

Following is my jquery code which gets a call on onclick function. its not letting me make name attribute empty of input tag.

function readUR(input) {    
            var id = $(input).attr('id');
            var ch = id.substr(id.length - 1);
            $('.trash-area'+ ch).css('display','none');
            $('#'+id).attr('src','img/plus.png');  
            $('#'+id).attr('name','');                      
    }

Answer 1

You have same ID attribute on your elements. Rename one of them.

Here is modified code:

<input type="file" name="upimage1" onchange="readURL(this);" class="upload" required/>

<span class="trash-area">
    <img class="trash-box" src="img/trash.png" width="24px" height="24px">
</span>

<script>
    $('body').on('click', '.trash-area', function () {
        $(this).prev().attr('name', '');
    })
</script>

https://jsfiddle.net/rn78L9kh/