How do i pass string with escape characters in javascript?

Question

There are many such questions here,but none of them was able to solve my question.I am trying to implement a simple toggle switch between "See more" and "See less" in SWT Browser in a java application.I am using this code with some changes http://jsfiddle.net/8u2jF/

My code would be something like

<div>
    <p id="textArea"><!-- This is where I want to additional text--></p>
</div>


<a id="toggleButton" onclick="toggleText(encodeURI('hsd\\nhe'));" href="javascript:void(0);">See More</a>

var status = "less";

function toggleText(s)
{
    var text="Here is some text that I want added to the HTML file";

    if (status == "less") {
        document.getElementById("textArea").innerHTML=decodeURI(s);
        document.getElementById("toggleButton").innerText = "See Less";
        status = "more";
    } else if (status == "more") {
        document.getElementById("textArea").innerHTML = "";
        document.getElementById("toggleButton").innerText = "See More";
        status = "less"
    }
}

But when i run this \\n is not taken as a new line character?How do i make Javascript understand that it is newline character?

I will be using this script in java SWT application and invoke it using SWT Browser.I will pass a string as a parameter which might contain any escape character.How do i handle them?

Answer 1

In HTML there is no such elements as \\t , \\n , \\r . Use <br/> for newline,      for \\t (or better css margin-right ).

 function addText(text) { $('span').append("<br/>First line goes here <br/> Second line goes here"); } function replaceText(text) { $('span').append( text.replace("\\\\n", '<br/>') ); } 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <div onClick="replaceText('<br/>First Line\\\\nSecond Line')">Click to add and replace</div> <div onClick="addText('<br/>First line goes here <br/> Second line goes here')">Click to see magic</div> <span></span> 

Answer 2

If you use

toggleText(encodeURI('hsd\nhe'));

(with a new line \\n)

and not

toggleText(encodeURI('hsd\\nhe'));

(the first \\ prevents the second one to be interpreted)

the result will be

<p id="textArea">hsd
he</p>

So there's a new line in the source code but this is not visible in the html rendering If you want a new line in the rendering, you need to add html markups