jquery - 如何在 html 中使用 fly on 复选框添加多个内容？

Question

我想使用复选框检查一些东西并在弹出窗口关闭时获取它们，如下所示：

我怎么能那样做？

假设我有一个 div 并且 div 包含项目，当我单击项目时，我想显示复选框，当我关闭该弹出窗口时，我需要检索那些选定的东西

<div id="div1" style="display:block;background-color:green">>
            <ul>
                <li>Item1</li>
                <li>Item1</li>
                <li>Item1</li>
                <li>Item1</li>
                <li>Item1</li>
                <li>Item1</li>
                <li>Item1</li>
                <li>Item1</li>
            </ul>
        </div>

Answer 1

您可以通过处理 li 元素点击来实现这一点（切换带有选中图标背景的类）

var selectedItems = "";
$("ul").on("click", "li", function() {
    var $this = $(this);
    $this.toggleClass("selected");
    selectedItems = $this.parent().find("li.selected").map(function() {
        return this.innerText || this.textContent;
    }).get().join(',');    
});

创建这个 css 类（类似）：

li {
  padding-left: 25px;
  cursor: pointer;
}

li.selected {
  background-image: url(http://www.pbsys.com.br/icon_checked.gif);
  background-repeat: no-repeat;
  background-position: 2px 3px;
}

要获取当前选定的项目，只需读取 selectedItems 变量