2

I have a textarea like this:

<textarea>
this is test1
and this is test2
plus it is test3
</textarea>

As you see, this positions are in the beginning of line: 0 (t), 14 (a), 32 (p).

Now I need to determine whether a position (I mean is the number of position) is at the beginning of a line?

For example:

10 : false
5  : false
14 : true
40 : false

How can I do that?

Shafizadeh
  • 9,960
  • 12
  • 52
  • 89
  • @Gavriel I just can get the position of specific character ... But now I don't know how can I determine that position is in the beginning of line or not .. – Shafizadeh Jan 21 '16 at 00:19
  • Do you have line breaks in your text ? I don't think you can directly detect word wrapping, but you may want to read Shadow Wizard's [solution](http://stackoverflow.com/questions/4719777/finding-line-breaks-in-textarea-that-is-word-wrapping-arabic-text) – R.Costa Jan 21 '16 at 00:23

3 Answers3

3

The contents of a textarea are stored in its value property. Here, new lines are represented by the ASCII new line non-printing character \n. We can split apart the the value of the textarea to give us an array which contains each line.

Next, we make another array, which will contain the starting positions of each line. We add 0 as an implied value. Next, we loop through the entire text array (starting from the second line as we have already added the first), and each time add an element to the lines array which is the lines array value for the text item before this one and the length of the text item before this one.

The logic in this is that:

  • The lines array contains all of the previous starting positions
  • The length of the previous text item added to the previous lines item results in (in your examples) something such as 0 + "this is test1".length = 13, which of course is one off.
  • So, we add one, yielding 0 + "this is test1".length + 1 = 14, and 14 + "and this is test2".length + 1 = 32.

Then, we simply test that pos (the position that we want to check; passed to the function) is in the lines array. If it is, then the result is true, else it's false.

Javascript Code:

function testpos(pos) {
    var text = document.getElementById("textareaid").value.split("\n");
    var lines = [0];
    for (i=1;i<text.length;i++) {
        lines.push(lines[i-1]+text[i-1].length+1)
    }
    return lines.indexOf(parseInt(pos))!=-1
}

You'll need this as your HTML:

<textarea id="textareaid">this is test1
and this is test2
plus it is test3</textarea>

And, here's a live demo: https://jsfiddle.net/g562gtge/

Toastrackenigma
  • 7,604
  • 4
  • 45
  • 55
1

if you want to know that the n-th position is at the beginning, then:

n == 0 || $("#textbox").val()[n-1] == '\n'
Gavriel
  • 18,880
  • 12
  • 68
  • 105
  • Works perfectly ... +1 – Shafizadeh Jan 21 '16 at 00:25
  • Do I need to replace `\n` with `\n|\r|\r\n` ? – stack Jan 29 '16 at 06:14
  • no because this is a string comparsion, not a RegEx, but you might need to modify the check in a way to make sure it works on win,mac as well. I think it is enough to test for \n or \n in [n-1], because that would also work when [n-2]=='\r', [n-1]=='\n' – Gavriel Jan 31 '16 at 11:01
1

JS Fiddle

var ta = document.getElementById('ta1'),
  taText = ta.textContent;

var lines = taText.trim().split('\n');

for (var i in lines) {
  console.log(lines[i][0]);
}
<textarea id="ta1">
this is test1
and this is test2
plus it is test3
</textarea>
Mi-Creativity
  • 9,554
  • 10
  • 38
  • 47
  • Do I need to replace `\n` with `\n|\r|\r\n` ? – stack Jan 29 '16 at 06:15
  • If you try it yourself, you'll get [this result](https://jsfiddle.net/jyg61t1b/1/), as you can see it will only outputs the first "**`t`**" and that because **`\n`** "newline" differs slightly than **`\r`** or **`\r\n`**, check this http://stackoverflow.com/questions/1761051/difference-between-n-and-r and this http://stackoverflow.com/questions/15433188/r-n-r-n-what-is-the-difference-between-them – Mi-Creativity Jan 29 '16 at 14:16