Как индивидуально удалить динамически созданный абзац?

-1

У меня есть кнопка, которая динамически создает абзацы в div вместе с идентификатором. Когда вы создаете абзац, вы также можете выбрать этот абзац («изменение цвета фона»), щелкнув его вместе с ним («Когда вы нажимаете на абзац») div создается со ссылкой внутри него. Пробовал удалить отдельно, но он удалит все абзацы сразуКак индивидуально удалить динамически созданный абзац?

Как удалить абзац, который выбирается («Я имею в виду индивидуально»)?

Вот ссылка и что я до сих пор:

http://jsfiddle.net/RzvV5/88/

Javascript/JQuery Код:

$(document).ready(function(){ 
    var id = 1; 
    $("#push").on({ 
     click: function(){ 
      var pr = $('<p class="test">This is text ' + id + '</p>'); 
      var d = $("#Test"); 
      var pclone = $(pr).clone(); 
      pclone.on({ 
       mouseenter: function(){  
        $(this).addClass("inside"); 
       }, 
       mouseleave: function(){        
        $(this).removeClass("inside"); 
       }, 
      }); 
      pclone.appendTo(d); 
      id++; 
     } 
    }); 

    var div = $('<div class="customD" id="d"></div>'); 
    var del = $('<a href="#" class="delete" id="erase">Delete</a>'); 
    var pcust = $(div).clone(); 
    var pdel = $(del).clone(); 

    $("#Test").on("click", "p", function(){ 
     var cur = $(this).css("background-color"); 

     if(cur=="rgb(255, 255, 255)") { 
      $(this).css("background-color","red").addClass("help insider"); 
      $(this).after(pcust); 
     } 
     else { 
      $(this).css("background-color","white").removeClass('help insider'); 
      $(pcust).remove(); 
     }  

     $(pcust).append(pdel); 

    }); 
});

HTML код:

<html> 
<body> 
    <a href="#" id="push">Push</a> 
    <div id="Test"></div> 
</body> 
</html>

CSS код:

.test { color: #000; padding: .5em; margin: 0px; border: 2px solid white; background: white;} 

.help { border: 2px dashed #FDD } 

.inside { border: 2px solid red } 

.insider { border: 2px solid #FDD; } 

.delete { font-size: 12px; } 
.customD { background: yellow}

источник

2012-04-25 jQueryster

Вы можете добавить обработчик события щелчка, чтобы удалить ссылку

$(".delete").live("click",function(){ 
     $(this).parent().prev().remove(); 
     $(this).remove(); 
    });

BTW. Вам не нужно клонировать каждую ссылку и ее родительский div, вы можете создать эту часть купола и удерживать ту же ссылку, если вы ее повторно используете с

var div = $('<div class="customD" id="d"></div>'); 
var del = $('<a href="#" class="delete" id="erase">Delete</a>'); 
div.append(del); 

    $("#Test").on("click", "p", function(){ 

     .... 
     $(pcust).append(del); //this will not clone delete div, it will actually replace its position it dome structure and move it from one paragraph to "pcust". This will save memory!!! 

     .... 
    };

источник

2012-04-25 00:32:12

Как индивидуально удалить динамически созданный абзац?

ответ

Смежные вопросы