Question

下面是html部分

<li class="main_menu catagory_li" id="cat4">
    <p class="ahead"><span class="heading">Item 4</span>
    <span class="fright remove">close</span></p>
</li>

当我点击close时，我会使用以下代码复制LI，

$('.remove').live('click',function(){
    var closed_elem_id = $(this).parent().parent().attr('id');

        s = $(this).parent().parent().clone().wrap('<div>').parent().html();
        $('li#'+closed_elem_id).remove();
        console.log(s);

});

这个删除特定地点的LI并获取副本并将其存储在variable s。

我的要求是在克隆副本中添加名为no-display的类，如<span class="fright remove no-display">close</span>。我尝试了很多方法，但它失败了。

请提供关于此的建议

注意：更新了我的问题

Answer 1

稍微优化：http://jsfiddle.net/hKUd6/

Answer 2

这样的事情：

$('.remove').live('click',function(){
    var pLi = $(this).closest('li');
    s = $('<div>').append(pLi.clone().addClass('no-display')).html();
    pLi.remove();
    console.log(s);
});

Answer 3

这一切都非常草率。您不需要使用尽可能多的代码来完成您正在尝试的简单任务。

尝试这样的事情：

$("li").on("click", ".remove", function(){
    var $this = $(this),
        liCont = $this.closest("p"),
        parentLi = $this.closest("li");
    liCont
        .clone()
        .wrap(
            $("<div>").addClass("no-display")
        )
        .appendTo("body");
    parentLi.remove();
});

我们在此处执行的操作是捕获任何.remove元素上的click事件。我们选择父p（我们后来克隆用div包裹）以及父li。我们克隆p元素（包括其内容），用div元素（我们使用DOM脚本创建并添加类）包装它，并将完成的产品附加到正文（您可以更改）如果需要的话）。然后，我们删除原始的li。

Answer 4

尝试使用此代码，它应该可以工作：

$('.remove').live('click',function(){
    var closed_elem = $(this).closest("li"); //get the li to be closed/removed
    var clonedElem = closed_elem.clone().find("span.remove").addClass("no-display"); //clone the original li and add the no-display class to the span having remove class
    closed_elem.remove(); //remove the original li
    console.log(clonedElem);
});

Answer 5

请检查以下代码行。

首先，你需要使用jquery获取当前的类名：

$('li #cat4').find('span').each(function(){
  var classname = $(this).attr('class');
  $(this).addClass(classname+' no-display');
});

这不是一个完整的任务代码，但它只是一个代码，您可以通过该代码获取当前类，然后向其中添加更多必需字符串并设置新类。

感谢。

使用jquery为生成的Html添加类名

5 个答案: