逐行閱讀textarea中的文本

Question

我正在使用textarea接受用戶輸入。 並想逐行閱讀。 但是它沒有顯示任何我想在不同行中用逗號分隔的文本列表

JS：

$('input[type=button]').click( function() {
    string = document.getElementById("hi").val();
    alert(string); 
    var html="";
    var lines = $('#id').val().split('\n');
    for(var i = 0;i < lines.length;i++){
        //code here using lines[i] which will give you each line
        html+=lines[i];
        html+=",";
    }
    $("#inthis").html(string);
});

HTML：

<textarea id="hi" name="Text1" cols="40" rows="5" placeholder="enter one wdg in one line" ></textarea>

<input type="button" value="test" />
<div id="inthis"></div>

這是jsfiddle：

http://jsfiddle.net/pUeue/1077/

Answer 1

這是更新的js ...

演示小提琴

$('input[type=button]').click(function () {
    var html = "";
    var lines = $('#hi').val().split('\n');
    for (var i = 0; i < lines.length; i++) {
        //code here using lines[i] which will give you each line
        html += lines[i];
        html += ",";
    }
    html = html.substring(0,html.length-1);
    $("#inthis").html(html);
});

Answer 2

首先，在示例中，您將本機javascript和jQuery代碼混為一談。 原生DOM元素沒有val()方法，例如jQuery。 其次，只需使用split()和join(',')即可大大簡化代碼。 嘗試這個：

$('input[type=button]').click( function() {
    var string = $("#hi").val().split('\n').join(',');
    $("#inthis").html(string);
});

小提琴的例子

Answer 3

.val()是一個Jquery函數，您必須將DOM元素轉換為jquery obj或使用.value

$('input[type=button]').click(function () {
  string = $(document.getElementById("hi")).val();
  string = string.replace("\n", ",")
  $("#inthis").html(string);
});

http://jsfiddle.net/pUeue/1090/

Answer 4

更改：

string = document.getElementById("hi").val();

至

string = document.getElementById("hi").value;

的jsfiddle

Answer 5

在第二行中有錯誤，您使用了jQuery val而不是value，所以請嘗試以下操作：

string = document.getElementById("hi").value;

並且需要在將字符串加載到div中之前放置以下行：-

html = html.substring(0,html.length-1);

Answer 6

http://jsfiddle.net/pUeue/1085/

$('input[type=button]').click( function() {
    string = $(document.getElementById("hi")).val();
    alert(string); 
    var htmlD="";
    var lines = string.split('\n');
    for(var i = 0;i < lines.length;i++){
    //code here using lines[i] which will give you each line
    htmlD+=lines[i];
    htmlD+=",";
}
    $("#inthis").html(htmlD);
});

Answer 7

我已經在這里更正了您的代碼： http : //jsfiddle.net/pUeue/1080/ 。

$('input[type=button]').click( function() {
    string = $("#hi").val();
    alert(string); 
    var html="";
    var lines = $('#hi').val().split('\n');
    for(var i = 0;i < lines.length;i++) {
        //code here using lines[i] which will give you each line
        html+=lines[i];
        html+=",";
    }
    $("#inthis").html(html);
});

Answer 8

嘗試這個

$('input[type=button]').click( function() {
    var lines =  $('#hi').val().split(/\n/);
    $("#inthis").html(lines.join(","));
});