如何将文本区域行拆分为不同的输入字段并编辑值

Question

我有这个用于移动设备的应用程序。它使用我服务器中的 txt 文件作为内容，我正在尝试为任何人使用任何网络浏览器更新这些文件提供简单的方法。

我的目标是根据行号将文本区域拆分为多个不同的输入字段。保持完整的文本区域内容顺序对我的应用程序正常运行至关重要。

Textarea 应该在加载页面时分成 textfields/select 选项（具有唯一 ID）。输入字段中的所有更改都应显示在 keyUp 上的文本区域中。

-

解决方案：终于成功了！感谢您的帮助 djnose，您的回答是完成这项工作的关键。

工作代码：JSFIDDLE (http://jsfiddle.net/_bestmanStudio/pq0gaao1/79/)

我知道它看起来很难看，我必须用 jQuery 单独写每一行，如果有人有更好的方法 - 我将不胜感激。

Answer 1

这是你想做的吗？我分叉了你的想法并稍微修改了一下！

id 可能有点 "fake"，但你会想出一个很好的解决方案:)

function createTextFields() {
var text = $("#msg").val();
var textArray = text.split('\n');
for (var singleLine in textArray) {
    var lineValue = textArray[singleLine];
    if (lineValue && lineValue.length > 0) {
        $('#inputs').append(
            $('<input>', {
                type: 'text',
                val: lineValue,
                id: singleLine,
                keyup: function() {
                    var test = $(this).val();      
                    var lines = $('#msg').val().split(/\n/);
                    lines[this.id] = test;
                    $("#msg").html(lines.join("\n"));
                }
            })
        ).append($('<br>'));            
    }            
}    
}

createTextFields();

http://jsfiddle.net/pq0gaao1/1

希望对您有所帮助

如何将文本区域行拆分为不同的输入字段并编辑值

How to split textarea lines into different input fields and edit values

html

jquery

split

textarea

line