jQuery：移动Li元素？

debugcn 发表于 Dev

汤姆

我正在编写以下jQuery脚本，即单击左div中的Li将其移至右div。

$(document).ready(function(){

   $('.left ul li').click(function(){
      var toAdd = $(this).html();
      $('.right ul').append('<li>' + toAdd + '</li>');
   });

    $(document).on('click', '.left ul li', function(){
        $(this).remove();
    });

});

它完美地工作。但是，如果我尝试对左div中的Li元素执行相同的操作，以使在对它们进行剔除后将它们移到左div中，则它将不起作用。

$(document).ready(function(){

   $('.left ul li').click(function(){
      var toAdd = $(this).html();
      $('.right ul').append('<li>' + toAdd + '</li>');
    });

    $(document).on('click', '.left ul li', function(){
        $(this).remove();
    });

  $('.right ul li').click(function(){
      var toAdd = $(this).html();
      $('.left ul').append('<li>' + toAdd + '</li>');
    });

  $(document).on('click', '.right ul li', function(){
        $(this).remove();
    });

});

我做错了什么？

这是codepen链接：

http://codepen.io/itsthomas/pen/hIfLD

谢谢你的帮助。

约格什

您无法将事件绑定到不存在的元素。

$(document).ready(function(){   
    $(document).on('click', '.left ul li', function(){
        $(this).remove();
        var toAdd = $(this).html();
        $('.right ul').append('<li>' + toAdd + '</li>');
    });  

    $(document).on('click', '.right ul li', function(){
        $(this).remove();
        var toAdd = $(this).html();
        $('.left ul').append('<li>' + toAdd + '</li>');
    });  
});

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。