檢查DIV內是否存在元素

Question

我想單擊時移動div內的元素，除非它已經在它內部。我想是這樣......

點擊標籤>如果元素是DIV無能爲力>否則移動元素到DIV

http://jsfiddle.net/establish/Xhhe8/

HTML

<ul> 
    <li><a href="#" class="tag">Art</a></li> 
    <li><a href="#" class="tag">Computing</a></li> 
    <li><a href="#" class="tag">Design</a></li> 
</ul> 

<div id="crate"> 
</div> 

jQuery的

$('.tag').on('click', function(event) { 

if ($('#crate').has(this)) { 
    // do nothing 
} 

else { 

    $(this).appendTo('#crate'); 
} 
}); 

它不起作用。也不知道如何表示「什麼也不做」，通常我只是使用單獨的IF語句，因此不需要表示它。我可以這樣做「無所作爲」並禁用點擊嗎？

$(this).off(); 

Answer 1

這應該做到這一點..

$('.tag').on('click', function(event) { 

    var self = $(this); 
    if (self.closest('#crate').length) { 
     // do nothing 
    } 
    else { 
     self.appendTo('#crate'); 
    } 

}); 

Answer 2

您通常使用if not表示if聲明相反（即!=更換==）：

$('.tag').on('click', function(event) { 
    if ($(this).parent().get(0) != $('#crate').get(0)) { 
     $(this).appendTo('#crate'); 
    } 
}); 

不是檢查是否該元素存在於父項中，爲什麼不比較父項？

演示：http://jsfiddle.net/Xhhe8/3/

Answer 3

蓋比的回答會的工作，但我寧願將其結構沒有空if塊這樣的：

$('.tag').on('click', function(event) { 
    var self = $(this); 
    if (self.closest('#crate').length == 0) { 
     self.appendTo('#crate'); 
    } 
}); 

Answer 4

你可以試試這個（我只是調整了一下你的代碼）：

$('.tag').on('click', function(event) { 

    if ($('#crate').find(this).length) { 
     // do nothing 
    } 

    else { 

     $(this).appendTo('#crate'); 
    } 
}); 

Answer 5

我來！

或者這樣：

$('.tag').click(function() { 
    if ($(this).parent().attr('id') != "crate") { 
     $(this).appendTo('#crate') 
    } 
}); 

http://jsfiddle.net/establish/Xhhe8/

Answer 6

我會做以下，根據Alex的答案：

$('.tag').on('click', function(event) {  
    if ($('#crate').find(this).length < 1) { 
     $(this).appendTo('#crate'); 
     $(this).off('click') 
    } 
    }); 

我認爲，如果條款使得在這種情況下，更多的意義;我們只是檢查箱子元素是否有'this'。 （if（$（'＃crate'）。has（this））「的語義是誤導性的，因爲當它實際上返回一個空數組時，它將會得到一個布爾值，該數組在JavaScript中的計算結果爲true。所以，即使「#crate」具有實際的元素，if條件始終爲真。