可排序的文本区域答案

【问题标题】：Sortable Textarea可排序的文本区域
【发布时间】：2010-12-31 06:24:33
【问题描述】：

我已经做了一个可排序的列表。

根据可排序列表的顺序，我想将文本插入到 textarea #notes。无论如何我可以根据列表对文本进行排序，所以即使我更改了顺序。 textarea 中的文本应相应更改

例如

<ul>
<li>entry 1</li>
<li>entry 2</li>
</ul>


entry 1 = "this is line 1"
entry 2 = "this is line 2"

我不确定我是否必须使用 Ajax 或其他东西来完成这项工作。因为我希望每个列表项都有预定义的文本。

我正在尝试学习 Jquery，并且真的很想得到任何帮助。关于我如何完成这项工作的任何提示。

问题

我在哪里以及如何存储这些预定义值？如何对文本区域的文本进行排序？

谁能指点我正确的方向

【问题讨论】：

标签： jquery-ui jquery jquery-ui-sortable

【解决方案1】：

也许写一个 javascript 函数到 refreshTextarea()，您最初将使用它来填充文本区域，并且每次排序更改时，它都会根据列表的排序顺序通过清空和重新填充来“刷新”它。

好的，要将值与您的列表项相关联，请给您的 ul 一个 id 和您的 li 唯一 id

<ul id="the-list">
    <li id="item-1">entry 1</li>
    ...
</ul>

然后为每个列表项创建一个隐藏输入，其 id 以某种方式对应

<input type="hidden" id="item-1-data" value="this is where you put info for the list item entry 1" />

然后使用 jquery，您可以通过循环遍历列表项并在进行任何排序后刷新您的 textarea 以编程方式关联它们。

$('#the-list li').each(function() {
    //get the id of the list's data field
    var li-data-id = $(this).attr("id") + '-data';

    // get the actual data associated with this list item
    var li-data = $(li-data-id).val();

    // append next list's data in the textarea
    $('#id-of-textarea').val($('#id-of-textarea').val() + "\n" + li-data)
}

【讨论】：

我可以像刷新按钮一样添加。但是我如何将文本放在 textarea 中。以及如何将预定义的文本分配给 li
在重新排序列表时触发“刷新”。
var li-data = $(li-data-id).val();

【解决方案2】：

文本区域只是一个文本块。您必须有某种方法来确定那里构成“可排序”行的内容。或者在列表更改时重新生成整个内容。

【讨论】：