Question

我正在使用dbushell制作的Nestable插件

以下是便于访问的演示：https://dbushell.com/Nestable/

我已经按照他在简单示例中显示的内容进行了设置。

HTML

<div class="dd">
    <ol class="dd-list">
        <li class="dd-item" data-id="1" data-selected="false">
            <div class="dd-handle">Item 1</div>
        </li>
        <li class="dd-item" data-id="2" data-selected="false">
            <div class="dd-handle">Item 2</div>
        </li>
        <li class="dd-item" data-id="3" data-selected="false">
            <div class="dd-handle">Item 3</div>
            <ol class="dd-list">
                <li class="dd-item" data-id="4" data-selected="false">
                    <div class="dd-handle">Item 4</div>
                </li>
                <li class="dd-item" data-id="5" data-selected="false">
                    <div class="dd-handle">Item 5</div>
                </li>
            </ol>
        </li>
    </ol>
</div>

JS：

$('.dd').nestable();

当前代码可以正常工作，因为我可以对列表进行排序，但是我需要其他一些无法使用的内容。

我需要在每个称为data-selected的li上都有一个附加属性。在页面加载时，我可以看到该属性从一开始就被序列化。

[{"selected":false,"id":1},{"selected":false,"id":2,"children":[{"selected":false,"id":3},{"selected":false,"id":4},{"selected":false,"id":5,"children":[{"selected":false,"id":6},{"selected":false,"id":7}]},{"selected":false,"id":8,"children":[{"selected":false,"id":9}]}]}]

然后，我需要具有一个OnClick函数，该函数可以在单击时将l i data-selected属性设置为true/false。

我已经编写了代码来相应地更新属性OnClick，但是在表单提交上调用$('.dd').nestable('serialize');时，它似乎没有在DOM中更新吗？

可嵌套JS OnClick函数

0 个答案: