2017-04-04 90 views
0

我想添加div並刪除div只有一個類。點擊jquery函數添加和移除div標記

現在我可以用兩個班級來完成。

<div class="optionBox"> 
<div class="block"> 
    <input type="text" /> <span class="remove">Remove Option</span> 
</div> 
<div class="block"> 
    <input type="text" /> <span class="remove">Remove Option</span> 
</div> 
<div class="block"> 
    <span class="add ">Add Option</span> 
</div> 

$('.add').click(function() { 
     $('.block:last').before('<div class="block"><input type="text" /><span class="remove">Remove Option</span></div>'); 

    }); 

    $(document).on('click', '.remove', function() { 
     $(this).parent().remove(); 
    }); 
</script> 

如何在jQuery的一個類引用做

+2

你爲什麼要1個班? –

+0

它就像一個按鈕,當我點擊一次它將項目添加到框,然後如果我再次單擊它,它會刪除 –

+0

所以,你只能添加一個項目?不知道爲什麼你只需要一個。 – epascarello

回答

0
$(this).parent().siblings(".block").remove(); 

你必須抓住元素的父母,你要

+0

我應該在哪裏寫這個 –

+0

替換$(this).parent()。remove(); –

+0

這刪除選項,但後來我不能再次加回我必須重新加載頁面 –

0

試試這個方法

$('.add').click(function() { 
    var customTemplate = ('<div class="block"><input type="text" /><span class="remove">Remove Option</span></div>') 
     $('.block:last').before(customTemplate); 

    }); 

$(document).off('click', '.remove'); 
    $(document).on('click', '.remove', function() { 
     $(this).parent().remove() 
    }); 

https://jsfiddle.net/b0bw0u8d/

+0

我想,當我點擊添加選項時,它應該刪除選項 –

+0

沒有得到你所說的? –

+0

otreva.com/calculator/# –