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

问题描述：

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','');                      
    }

以下是我的html代码，我在调用一个函数来删除所选图像，该图像在输入的name属性中存储标记。 p>

 ＆lt; input id =“im1”type =“file”name =“upimage1”onchange =“readURL（this）;”  class =“upload”required /＆gt; 
＆lt; span class =“trash-area1”id =“im1”onclick =“readUR（this）”＆gt;＆lt; img class =“trash-box”src =“img  /trash.png“width =”24px“height =”24px“＆gt;＆lt; / span＆gt; 
  code>  pre> 
 
 以下是我的jquery代码，可以在onclick上调用 功能。 它不允许我使name属性为空输入标记。 p> 
 
 
  function readUR（input）{
 var id = $（input）.attr（'id'）; \  n var ch = id.substr（id.length  -  1）; 
 $（'。trash-area'+ ch）.css（'display'，'none'）; 
 $（'＃'+ id）  .attr（ 'SRC'， 'IMG / plus.png'）;  
 $（'＃'+ id）.attr（'name'，''）;  
} 
  code>  pre> 
  div>

答

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/

答

$('button').on('click', function() {
  $('span[name]').removeAttr('name');
});

span {
  background-color: tomato;
}

span[name] {
  background-color: DodgerBlue;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<span name="test">Can I haz name? Name exists -> Blue, otherwise red</span>

<button>Remove name</button>

</div>

答

Rename the id attributes from span & input then , try the below:

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

答

Correct code as follows...

<input id="im1" type="file" name ="upimage1" onchange="readURL(this);" class="upload" required/>
<span class="trash-area1" id="im1" onclick="readUR()">
    <img class="trash-box" src="img/trash.png" width="24px" height="24px">              
</span>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>

<script>
 function readUR() {
    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','');
}
</script>

答

First of all your jquery function is called readUR, but you are calling readURL(this). Fix this typo first.

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

相关推荐