jquery - 如何获取列表项并将其显示在文本字段 jquery 中

Question

我正在开发一个 Web 应用程序，并且很难解决这个问题。

我有一个看起来像这样的列表项：

<ul id="list">
    <li>My name is great</li>
    <li>I love Music</li>
    <li>I love EPL</li>
</ul>

我也有一个文本框。

我要做的是克隆或映射（以最佳方法为准）列表项并将其添加到我的文本框值中。

请注意，整个元素 + 文本将被克隆到文本框值。例如：

<li>My name is great</li>

将被克隆到文本框值。

Answer 1

假设你给你的文本框一个id，例如：

<textarea id="contents"></textarea>

然后您可以使用 jQuery 执行此操作：

$("#contents").val($("#list").html());

解释：

• $("#list").html()获取id 元素的HTML 内容list。
• $("#contents").val()使用 id 设置元素的内容contents。

这样做的一个问题是该html()函数可能会保留格式，因此您的列表元素之前可能会在 textarea 中出现一堆空白。这可能取决于浏览器。

将修剪任何前导空格的解决方案：

$("#contents").val($("#list").html().replace(/^\s+/gm, ""));

这使用 javascript 正则表达式/^\s+/gm从列表 HTML 的所有行的开头修剪空白。