I'm having trouble removing selected inputs from various inputs.
I have the following code:
$(document).ready(function() {
var btnremoveimg = $('.remover-img');
btnremoveimg.click(function() {
$(this).parent().remove();
});
});
.img {
float: left;
margin-left: 10px;
}
.img img {
border: solid 1px #ccc;
padding: 2px;
}
.img button {
width: 126px;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><divid="list-inputs">
<input type='hidden' name='upload-img[]' value='http://lorempixel.com/output/abstract-q-c-120-120-6.jpg'>
<input type='hidden' name='upload-img[]' value='http://lorempixel.com/output/abstract-q-c-120-120-4.jpg'>
<input type='hidden' name='upload-img[]' value='http://lorempixel.com/output/abstract-q-c-120-120-6.jpg'>
</div>
<div class='img'>
<div class='conteudo-img'>
<img src="http://lorempixel.com/output/abstract-q-c-120-120-6.jpg"></div><buttontype='button'class='remover-img'>RemoverImagem</button></div></div><divclass='img'><divclass='conteudo-img'><imgsrc="http://lorempixel.com/output/abstract-q-c-120-120-4.jpg">
</div>
<button type='button' class='remover-img'>Remover Imagem</div>
</div>
<div class='img'>
<div class='conteudo-img'>
<img src="http://lorempixel.com/output/abstract-q-c-120-120-5.jpg">
</div>
<button type='button' class='remover-img'>Remover Imagem</div>
</div>
I need that when I click on .Remover Imagem
I delete the input with the same value as the src of the image. But I'm having a hard time getting to that.
Would anyone help me?