Question

我想在点击按钮时在p标记中添加div标记，当我点击p标记时，我想要删除p我点击了标签。

这是我的Jquery：

$('#ajou').click(function(){
    alert( $('#skill').val());
    $('#skills').append('<p>'+$('#skill').val()+'</p>');
});

$("p").click(function(){
    $(this).remove();
});`

这是我的HTML：

 <input type="text" id="skill" name="skill"> 
 <button id="ajou" name="ajou">Valide</button>
 <br><br>
 <div name="skills" id="skills"><p>hello</p> </div>

具体来说，当我点击按钮Valid时，我在输入中输入的文字会添加到我的<div>，但是当我想删除它时我无法{仅} { {1}}会在我点击它时将其删除。

Answer 1

编辑为完整示例，并且仅在点击时删除<p>元素。适用于静态和动态<p>元素。

HTML：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<input type="text" id="skill" name="skill"> 
<button id="ajou" name="ajou">Valide</button>
<br><br>
<div name="skills" id="skills"><p>hello</p> </div>

JAVASCRIPT：

$('#ajou').click(function(){
    alert( $('#skill').val());
    $('#skills').append('<p>'+$('#skill').val()+'</p>');
});

$(document).on('click', '#skills p', function(events){   
    events.target.remove();
});

后者是将删除函数绑定到父元素（#skills），因为子元素将在以后动态添加，因此无法事先绑定。一旦你点击了父母的点击，就可以删除点击的孩子<p>（目标元素）。

Answer 2

对事件处理程序稍作更改以赋予其范围：

$('#skills').on('click', 'p', function(){
    $(this).remove();
});

这允许事件绑定到技能，从而允许从该范围内删除所有段落（p）。绑定到p元素只绑定到当前存在的段落（文档中的任何位置）而不是添加的段落。

Answer 3

$('div', {
    id: 'foo',
    name: 'anything',
    title: 'adding these attributes is not necessary',
    text: 'Waow, I am one sexy p tag'
}).appendTo($('.myDiv'));

插入/删除应答器

3 个答案: