问题与jQuery appendTo（）

我有一个问题附加列表项从一个ul到另一个。当每个列表项被点击时，它应该被附加到另一个ul中。但是，一旦这些项目被追加，他们将继续追加到他们当前的ul中......意味着他们将自己排序到列表的底部。例如：问题与jQuery appendTo（）

<ul class="first-holder"> 
      <li><input type="checkbox" name="location1" /> Location 1</li> 
      <li><input type="checkbox" name="location2" /> Location 2</li> 
      <li><input type="checkbox" name="location3" /> Location 3</li> 
      <li><input type="checkbox" name="location4" /> Location 4</li> 
      <li><input type="checkbox" name="location5" /> Location 5</li> 


      </ul> 


      <div class="more-options first-option"> 
      <ul> 
      <li><input type="checkbox" name="location-6" checked="checked" /> Location 6</li> 
      <li><input type="checkbox" name="location7" checked="checked" /> Location 7</li> 
      <li><input type="checkbox" name="location8" checked="checked" /> Location 8</li> 
      </ul> 
      </div>

jQuery的：

$('div.more-options li').click(function() { 

       $(this).appendTo($('ul.first-holder')); 
       return false; 

      });

什么情况是这样的：在div.more选项的列表项将追加到ul.first保持者，但是当这些项目在ul.first-holder中，点击它们会使它们追加到ul.first-holder的末尾。一旦李氏被附加到ul.first-holder后，他们就不应该移动到任何地方。我无法弄清楚如何做到这一点。

来源

2010-10-05 johnnyb

尝试从项目中删除事件处理程序。它会停止接收点击事件。

$(this).unbind('click'); 
$(this).appendTo($('ul.first-holder'));

http://api.jquery.com/unbind/

来源

2010-10-05 14:19:25

没错，这做到了。谢谢。 – johnnyb 2010-10-05 18:05:34

那是因为你正在与它相连的单击事件的节点。所以当该节点被追加到其他ul时，click事件仍然适用。

您可以复制节点并追加该节点，或者在追加时删除单击事件。

来源

2010-10-05 14:20:26

使用.delegate()这里，而不是像这样：

$('div.more-options').delegate('li', 'click', function() { 
    $('ul.first-holder').append(this); 
});

You can test it out here。

目前您click处理程序是在<li>元素，并与他们感动......而不是把click处理器上.more-options<div>本身，所以没有处理移动。这也是便宜的要执行，如果你有以上几个要素:)

来源

2010-10-05 14:21:06

你想只处理第一click事件，这样更多：

$('div.more-options li').one('click', function() { ... }):

来源

2010-10-05 14:21:36 SLaks

问题与jQuery appendTo（）

回答

相关问题