Javascript 如何使用jquery将复选框的值追加和删除到ul li 清单1 清单2 清单3 清单4 $（'.li'）。单击（函数（）{ $（此）.toggleClass（“活动检查表”）； }); .李b { 字体大小：14px； 字体大小：400； 颜色：#555454； 位置：相对位置； 顶部：-3px； 左侧填充：5px； 颜色：#A7A7； } .检查表li.主动-检查表b { 颜色：#202020； 字体大小：继承； 顶部：2个； } .检查表li，.活动检查表li { 利润底部：4倍； } 清单 { 字体系列：helvetica； 字体大小：14px； 左边距：23px； 光标：指针； 列表样式类型：无； 显示：内联块； 浮动：左； 边缘顶部：15px； 填充：0； } .li span先生 { 宽度：16px； 高度：16px； 边界半径：3px； 显示：内联块； 背景色：#f6f6f6； 边框：1px实心#C2C2； } .检查表li.主动-检查表范围 { 边框：1px实心#49a1d7； } .li span cite { 显示：无； } .检查表li.主动-检查表跨度引用 { 位置：相对位置； 左：2px； 显示：内联块； 宽度：10px； 高度：10px； 边界半径：3px； 背景色：#49a1d7； 边界：无； }

我需要在清单li使类处于活动状态时将清单li的值附加到附加清单的列表中，并在从清单li中删除活动类时删除该值。提前谢谢。请看小提琴

尝试

.clone（）

所选的

li

s，然后根据您的意愿将其

.append（）

添加到另一个UL中

<ul class="checklist">
  <li><span><cite></cite></span><b>List 1</b></li>
  <li><span><cite></cite></span><b>List 2</b></li>
  <li><span><cite></cite></span><b>List 3</b></li>
  <li><span><cite></cite></span><b>List 4</b></li>
</ul>
<ul class="append-checklist">
</ul> 

$('.checklist li').click(function () {
   $(this).toggleClass("active-checklist");
});

.checklist li b 
{
    font-size: 14px;
    font-weight: 400;
    color: #555454;
    position: relative;
    top: -3px;
    padding-left: 5px;
    color:#a7a7a7;
}
.checklist li.active-checklist b
{
    color: #202020;
    font-size:inherit;
    top:2px;
}
.checklist li,.active-checklist li
{
    margin-bottom: 4px;
}
.checklist
{
    font-family:helvetica;
    font-size: 14px;
    margin-left: 23px;
    cursor: pointer;
    list-style-type: none;
    display: inline-block;
    float: left;
    margin-top: 15px;
    padding:0;
}

.checklist li span
{
    width: 16px;
    height: 16px;
    border-radius: 3px;
    display: inline-block;
    background-color: #f6f6f6;
    border: 1px solid #c2c2c2;
}
.checklist li.active-checklist span
{
    border: 1px solid #49a1d7;
}
.checklist li span cite
{
    display: none;
}
.checklist li.active-checklist span cite
{
    position: relative;
    left: 2px;
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 3px;
    background-color: #49a1d7;
    border: none;
}

根据您的新要求使用

$('.checklist li').click(function () {
    $(this).toggleClass("active-checklist");
    $('ul.append-checklist').empty().append($(this).closest('ul').find('.active-checklist').clone())
});

$（'.li'）。单击（函数（）{
$（此）.toggleClass（“活动检查表”）；
$（'ul.append checklist'）.html（$.map（$（this）.closest（'ul'）.find（'.active checklist'）），函数（elem，i）{return“
”+$（elem.text（）+”
”；}））
});

尝试

.clone（）

所选的

li

s，然后根据您的意愿将其

.append（）

添加到另一个UL中

<ul class="checklist">
  <li><span><cite></cite></span><b>List 1</b></li>
  <li><span><cite></cite></span><b>List 2</b></li>
  <li><span><cite></cite></span><b>List 3</b></li>
  <li><span><cite></cite></span><b>List 4</b></li>
</ul>
<ul class="append-checklist">
</ul> 

$('.checklist li').click(function () {
   $(this).toggleClass("active-checklist");
});

.checklist li b 
{
    font-size: 14px;
    font-weight: 400;
    color: #555454;
    position: relative;
    top: -3px;
    padding-left: 5px;
    color:#a7a7a7;
}
.checklist li.active-checklist b
{
    color: #202020;
    font-size:inherit;
    top:2px;
}
.checklist li,.active-checklist li
{
    margin-bottom: 4px;
}
.checklist
{
    font-family:helvetica;
    font-size: 14px;
    margin-left: 23px;
    cursor: pointer;
    list-style-type: none;
    display: inline-block;
    float: left;
    margin-top: 15px;
    padding:0;
}

.checklist li span
{
    width: 16px;
    height: 16px;
    border-radius: 3px;
    display: inline-block;
    background-color: #f6f6f6;
    border: 1px solid #c2c2c2;
}
.checklist li.active-checklist span
{
    border: 1px solid #49a1d7;
}
.checklist li span cite
{
    display: none;
}
.checklist li.active-checklist span cite
{
    position: relative;
    left: 2px;
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 3px;
    background-color: #49a1d7;
    border: none;
}

根据您的新要求使用

$('.checklist li').click(function () {
    $(this).toggleClass("active-checklist");
    $('ul.append-checklist').empty().append($(this).closest('ul').find('.active-checklist').clone())
});

$（'.li'）。单击（函数（）{
$（此）.toggleClass（“活动检查表”）；
$（'ul.append checklist'）.html（$.map（$（this）.closest（'ul'）.find（'.active checklist'）），函数（elem，i）{return“
”+$（elem.text（）+”
”；}））
});

---

尝试此操作：检查单击的

li

是否有

class=“active checklist”

，然后将其克隆并添加到

附加检查表中，否则从
附加检查表中删除

$('.checklist li').click(function () {
    $(this).toggleClass("active-checklist");
    $('ul.append-checklist').html($.map($(this).closest('ul').find('.active-checklist '),function(elem,i){ return "<li>" + $(elem).text() + '</li>'; }))
});

尝试以下操作：检查单击的
li
是否有
class=“active checklist”
，然后对其进行克隆并将其添加到
附加检查表中，否则从
附加检查表中删除

$('.checklist li').click(function () {
    $(this).toggleClass("active-checklist");
    $('ul.append-checklist').html($.map($(this).closest('ul').find('.active-checklist '),function(elem,i){ return "<li>" + $(elem).text() + '</li>'; }))
});

<强> 
> P>但是，这是不健全的，就像你有相同的文本的列表项，它们将“代码>碰撞< /代码>考虑通过< jQuery中的<代码>数据< /代码>属性添加<代码> ID <代码> s。< /P>
$('.checklist li').click(function () {
    $(this).toggleClass("active-checklist");
    if($(this).hasClass('active-checklist'))
     $(this).clone().appendTo('.append-checklist');
    else
     $('.append-checklist').find('li:contains('+$(this).text()+')').remove();
});

 DEMO：
< P>但是，这是不健全的，就像你有相同的文本的列表项，它们将“代码>碰撞< /代码>考虑通过< jQuery中的<代码>数据< /代码>属性添加<代码> ID <代码> s。< /P>
$('.checklist li').click(function () {
    $(this).toggleClass("active-checklist");
    if($(this).hasClass('active-checklist'))
     $(this).clone().appendTo('.append-checklist');
    else
     $('.append-checklist').find('li:contains('+$(this).text()+')').remove();
});

演示：
一旦清单li激活了类，我需要将清单li的值附加到附加清单的列表中，一旦从清单li中删除了活动类，我需要删除该值。
完全混淆。你能简单地解释一下吗？一旦我的检查表li激活了课堂，我就需要将我的li值从检查表中附加到附加检查表的li中。类似地，如果从li中删除了活动类，那么也应该从追加检查表li中删除值。
一旦检查表li的类处于活动状态，我需要将检查表li的值追加到追加检查表的列表中，并且一旦从检查表li中删除了活动类，就删除该值。
完全混淆。你能简单地解释一下吗？一旦我的检查表li激活了课堂，我就需要将我的li值从检查表中附加到附加检查表的li中。类似地，如果从li中删除了活动类，那么值也应该从追加检查表li中删除。上面的代码将整个li克隆到追加检查表中。当li追加到追加检查表的li时，我需要从li中删除span并引用attr。我还需要一个关闭符号，当它被单击时，它将删除li。@Benjamin，等等，我正在处理它。。给我3分钟。：）再次感谢你的努力。：）地图功能有什么用？你能给我解释一下吗bit@Benjamin它将把一个集合转换成我们所需格式的另一个集合。看一看。上面的代码将整个li克隆到追加检查表中。当li追加到追加检查表的li时，我只需要删除span并从li中引用attr。我还需要一个关闭符号，当它被单击时，它将删除li。@Benjamin，等等，我正在处理它。。给我3分钟。：）再次感谢你的努力。：）地图功能有什么用？你能给我解释一下吗bit@Benjamin它将把一个集合转换成我们所需格式的另一个集合。看一看这张照片。