Добавление «ссылки удаления» к клонированным элементам с помощью jQuery

#javascript #jquery #html #git #jquery-ui

#javascript #jquery

Вопрос:

Все,

Мне нужно добавить ссылку «удалить» в конец всех моих клонированных разделов, но не в источник клонированного материала. Это то, что у меня есть до сих пор

Нужно что-то вроде этого:

Шаг первый:

введите описание изображения здесь

Шаг второй: (Клонированный материал не получает ссылку на удаление)

введите описание изображения здесь

  <html>
    <head>
     <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
        <title>Demo</title>

    <script type="text/javascript">
    var uniqueId = 1;
    $(function() {
         $('.addRow').click(function() {

             var copy = $("#cosponsors").clone(true).appendTo("#myForm");
             var cosponsorDivId = 'cosponsors_'   uniqueId;
             copy.attr('id', cosponsorDivId );

             $('#myForm div:last').find('input').each(function(){
                $(this).attr('id', $(this).attr('id')   '_'  uniqueId); 
                $(this).attr('name', $(this).attr('name')   '_'  uniqueId); 

             });

             uniqueId  ;  
         });
    });
    </script>


    <style type="text/css">

    </style>
    </head>
    <body>
    <div id="container">
        <h3>Sponsors</h3>
        <form action="" id="myForm">
          <div id="cosponsors" style="padding:12px;">
            <label>Sponsor Info:</label> <input  type="text" id="cosponsorcontact" name="cosponsorcontact"  placeholder="Name" title="Co-sponsor contact" />
            <input  type="text" id="cosponsoremail"  name="cosponsoremail"     placeholder="Email" title="Co-sponsor email" />
            <input  type="text" id="cosponsorphone"  name="cosponsorphone"     placeholder="Phone" title="Co-sponsor phone" />
          </div>
         </form>


        <input type="button" class="addRow" value="Add Sponsor" />

    </div>
    </body>
    </html>
  

Ответ №1:

Попробуйте это:

  var deleteLink = $("<a>delete</a>");
 deleteLink.appendTo(copy);
 deleteLink.click(function(){
     copy.remove();
 });
  

Обратите внимание, что вам нужно будет соответствующим образом оформить ссылку удаления, поскольку у нее нет href.

JSFiddle: http://jsfiddle.net/5QBLB /

Комментарии:

1. Отсутствует > ссылка на удаление — вы, должно быть, скопировали ее за 20 секунд до того, как я отредактировал свой ответ 😉

2. Это то, что мне было нужно. Спасибо!