-3

私は JavaScript の経験がまったくありませんが、かなり単純な問題の解決策が必要です。

HTMLテキストエリアに情報を入力し、ボタンを押して、テキストエリアの内容を異なるテキストボックスに分割できるようにしたいと考えています。視覚化すると、より明確になるかもしれません。

だから私はこれから行きたい:

<textarea>
Line 1
Line 2
Line 3
<textarea>

これに:

<input type="text" value="Line 1" />
<input type="text" value="Line 2" />
<input type="text" value="Line 3" />

ありがとう!

4

1 に答える 1

3

Assuming your HTML is as follows

<textarea id="text_area">
Line 1
Line 2
Line 3
</textarea>

<div id="input_text"></div>

This Javascript will create input elements based on the contents of your text area

// Destination element to contain the input elements
var destination = document.getElementById('input_text');

// Contents of textarea
var content = document.getElementById('text_area').innerHTML;

// Array containing each line of the textarea
var lines = content.split('\n');

for(i = 0; i <= lines.length; i++)
{
    if(lines[i] != '' && lines[i] != undefined)
    {
        // Create input element
        el_name = 'input_' + i;
        el = document.createElement('input');
        el.setAttribute('type', 'text');
        el.setAttribute('name', el_name);
        el.setAttribute('value', lines[i]);

        // Append input element to destination
        destination.appendChild(el);
    }
} 

Working example here http://fiddle.jshell.net/AvA3a/

于 2013-10-09T14:49:00.987 に答える