jQuery的追加和刪除

我想用這個jQuery的追加一些HTML，然後unappend它jQuery的追加和刪除

if(!(jQuery(check).hasClass('selected'))){ 
    jQuery(this).append('<span class="selected">&nbsp;</span>'); 
    }

我怎麼能做到這一點，也實時更新嗎？我只是想在用戶「點擊」或「關閉」時添加此元素？

即如果檢查沒有「Selected」類 - append - else remove？

來源

2010-11-18 Tom

你能提供一些html嗎？ – Reigel 2010-11-18 06:58:20

由於您的問題是一種模糊和缺乏標記，我用了演示的基本複選框示例。我已經包括了一個鏈接到一個現場演示在的jsfiddle here

HTML：

<input type="checkbox" id="test" /> Check me 

<div id="items"></div>

的JavaScript：

$("#test").bind('click', function(){ 

    var $t = $(this); 

    if($t.is(':checked')){ 
    // append item 
    $('#items').append('<span class="selected">I was recently appended.</span>'); 
    }else{ 
    // empty div and remove it from DOM (empty helps with memory leak issues with remove()) 
    $('span', '#items').empty().remove(); 
    } 
});

來源

2010-11-18 07:57:08 Kieran

jQuery('#check').click(function() { 
    var check = jQuery(this); 

    if (!check.hasClass('selected')) { 
     jQuery('#mydiv').append('<span class="selected">&nbsp;</span>'); 
     check.addClass('selected'); 
    } else { 
     jQuery('#mydiv span.selected').remove(); 
     check.removeClass('selected'); 
    } 
});

來源

2010-11-18 07:07:52 aefxx

我想你不需要在那裏添加span標籤。那麼，代碼可以這樣簡短。

$("#check").click(function(){ 
    $(this).hasClass('selected') ? $(this).removeClass('selected') : $(this).addClass('selected'); 
});

來源

2010-11-18 07:27:30

我相信更多更好的辦法可能是保存的結果每個附加到數組或變量，並在刪除元素時循環。對於單個元素，

// Appending 
var ele = $('<span>', { 
    html: 'nbsp;', 
    class: 'selected' 
}).appendTo(container); 

// Removing 
ele.remove();

如果從事件處理程序中這樣做，可變ele應該在外面的範圍定義，所以它是訪問之後。爲多個項目：

// Appending 
var ele = []; 
ele.push($('<span>', { 
    html: 'nbsp;', 
    class: 'selected' 
}).appendTo(container)); 

// Removing 
for(var i = 0; i < ele.length; i++){ 
    ele[i].remove(); 
}

同樣，陣列ele應該任何事件處理程序的範圍之外來限定。否則，這個問題的其他答案也會起作用。

來源

2010-11-18 08:27:43

jQuery的追加和刪除

回答

相關問題