Remove group of Divs "Clones" in jquery

Asked

Viewed 254 times

-3

I have a group of Divs that can be cloned in jquery, I need that by clicking "in the image of the recycle bin with the delete id" removes the cloned Divs when clicked...

Follows the code..

    <script type="text/javascript" src="http://code.jquery.com/jquery-1.11.2.min.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <script>
       $(document).ready(function() {

            $("#duplicar").click(function() {
            linha = $("#copia").html();
            $("#base").append("<br />"+linha+"<br />");
            });

        });
    </script>

        <div id="base">
        <div id="copia">
        <form class="questoes">
            <input type="text" name="pergunta" placeholder="Pergunta"><!-- Campo de pergunta-->

            <select><!-- Campo de opções -->
                <option>Resposta Curta</option>
                <option>Parágrafo</option>
                <option>Múltipla Escolha</option>
                <option>Caixas de Seleção</option>
            </select>
        </form><br>

        <form class="resposta"><!-- Campo de resposta-->
            <input type="text" name="resposta">
        </form><br>

        <div class="barra-inferior">

             <div class="area-obrigatorio">
                <label class="obrigatorio" for="obrigatorio"><strong>OBRIGATÓRIA</strong></label>
                <input type="checkbox" name="obrigatorio" id="obrigatorio">
             </div>
             <div class="area-botoes" >
                <img src="img/Defult Text.png" class="dublicar" id="duplicar">
                <img src="img/delete_remove_bin_icon-icons.com_72400.png" class="excluir" id="excluir">
            </div>
        </div>
        </div>
        </div>
  • Your question says only "Remove group of Divs "Clones" in jquery". You can explain the question better and what you couldn’t solve?

  • I create a clone with: $("#duplicate"). click(Function() { line = $("#copy").html(); $("#base").append("<br />"+line+"<br />"); }); then I want to know how to delete the copy, being that I saw in a corner that excludes the last thing, I want to copy a 3 Divs and delete your copies afterwards

1 answer

0

Try to do it this way:

<script>
 $(document).ready(function() {
    $("#duplicar").click(function() {
        // coloca um id e uma classe para cada div copiada 
        var id = +(new Date());
        $clone = $("#copia").clone();
        $clone.attr('id', 'copia-'+id).addClass('div-copia');
        $("#base").append("<br />"+$clone+"<br />");
    });

    // no click do excluir você procura pelo elemento pai e o remove
    $(document).on('click', '.excluir', function(event) {
        event.preventDefault();
        var $this = $(this),
            $div = $this.parent('.div-copia');
        $div.remove();
      });
   });
 </script>
  • Fernando I think it served but I must admit that I’m quite beginner in jquery and kind of got lost in where I should put id , class and the parent element would be in case the #copy or #base or even the id of the first copy

Browser other questions tagged

You are not signed in. Login or sign up in order to post.