在无序列表中将多个Textareas转换为LI

时间:2013-03-21 09:47:37

标签: javascript jquery html

我的textareas数量不详。要处理用户输入的数据,我需要将其内容转换为列表元素。

使用JavaScript和/或jQuery,我该如何转换它:

<textarea>content 1</textarea>
<textarea>content 2</textarea>
<textarea>content 3</textarea>

对此:

<ul>
    <li>content 1</li>
    <li>content 2</li>
    <li>content 3</li>
</ul>

我需要将生成的UL与发送到AJAX服务的变量对齐。

编辑 - 到目前为止我尝试过:

var visibleTextareas = $('textarea:visible');

var listItems = visibleTextareas.replaceWith(function() {
    return $('<li>' + $(this).val() + '</li>');
});

var text = '<ul>' + listItems + '</ul>';
console.log(text);

这导致<ul>[object Object]</ul>被记录到控制台,后端响应它需要UL。

2 个答案:

答案 0 :(得分:2)

尝试这样的事情:

var output = '<ul>';

$('textarea').each(function(){
    output += '<li>' + $(this).val() + '</li>';
});

output += '</ul>';

这对你有用吗?

编辑: .val()在这种情况下更合适。

答案 1 :(得分:0)

查看.each()上的jQuery API,第二个示例可以帮助您..