Develop Reference

input value formation with double quotation marks and single quotes [duplicate]

This question already has answers here:
Escaping single quotes in JavaScript string for JavaScript evaluation
(9 answers)
Closed 4 years ago.
I have problem in the input "value".
$("#printCard").append("<input type='hidden' name='textCard' value='that aren't on the battlefield have flash. ' id='texting'>");
or JSON:
$("#demo").append("<input type='hidden' name='textCard' value='"+ infoCard.text +"' id='texting'>" );
Result:
<input name="textCard" value="that aren" t="" on="" the="" battlefield="" have="" flash.="" '="" id="texting" type="hidden">
The problem is double quotation marks and single quotes(aren't..).
This example:
The two options I have to save, double quotation marks and single quotes.
thank you all

If you don't need to support IE use template literals. TL are strings that have an easier syntax and extra properties. Here's a comparison between TL and SL (String Literal):
Syntax
SL: Wrap strings in double or single quotes. If the content of string has quotes as well, they should either be escaped by being prefixed with a backslash:
\" and \'
OR use HTML entities:
‘ or ‘ (Left Single QUOtation mark)
’ or ’ (Right Single QUOtation mark)🟊
“ or “ (Left Double QUOtation mark)
” or ” (Right Double QUOtation mark)
Note: These particular quotes represented by HTML entities are the curvy or smart quotes type and can only be used in plain text not code. The quotes used in code are straight, do not confuse them as universally accepted they are as different as a comma is to a period.
🟊 It's ok to use ’ as an apostrophe - Unicode9.0.0, ch06, pg. 276
TL: Wrap strings in backticks, also called grave accent, On a QWERTY keyboard the key is located at the top left corner `.
`template literal`
Concatenation vs. Interpolation
SL: A mess of single quotes, double quotes, and pluses:
var str = '<input id="'+ID+'" class="form-control">';
TL: Wrap variables and expressions in: ${...}:
var str = `<input id="${ID}" class="form-control">`;
Demo
var infoCard = {
text: "that aren’t on the battlefield have flash."
};
$("#printCard0").append(`<input type='hidden' name='textCard' value='that aren’t on the battlefield have flash.' id='texting0'>`);
$("#printCard1").append(`<input type='hidden' name='textCard' value='${infoCard.text}' id='texting1'>`);
<main id='core'>
<figure id='printCard0'></figure>
<figure id='printCard1'></figure>
</main>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

I recommend using the object-based method, then you don't have to worry about special characters in HTML.
$("#printCard").append($("<input>", {
type: "hidden",
name: "textCard",
value: infoCard.text,
id: "texting"
});

How to render unicode escape sequences using javascript?

Below code,
document.writeln("Caracteres escapados {\u55e8\uff0c\u4f60\u597d\u5417}: "
+ "\u55e8\uff0c\u4f60\u597d\u5417");
expected output is \u55e8\uff0c\u4f60\u597d\u5417: 嗨，你好吗
Current output is: Caracteres escapados {嗨，你好吗}: 嗨，你好吗
What modification is required in the above code?

You need to escape your backslashes and remove the braces.
document.writeln("Caracteres escapados \\u55e8\\uff0c\\u4f60\\u597d\\u5417 "
+ "\u55e8\uff0c\u4f60\u597d\u5417");

Just escape the backslashes of the codes you want to show without translating:
document.writeln("Carácteres escapados \\u55e8\\uff0c\\u4f60\\u597d\\u5417: \u55e8\uff0c\u4f60\u597d\u5417");

Need to escape " , ' along with other UNICODE characters

I have the following string :
"ѯѰѱѲ & <b>BOLD</b> <>?:"{}|+_)(*&^%\\\\\\$##!~`,./;'[]\
(with the starting " and the " in the middle).
I tried the following 3 functions : escape, encodeURI and encodeURIComponents.
However all three give the error of : SyntaxError: Unexpected token { obviously due to the presence of starting " closing with the middle ".
I do not want to use regex replace to escape " and ' in the string. Is there any direct JS/jQuery function which would do the same?
CODE:
Was earlier doing this : e.title.toLowerCase().indexOf(encodeURIComponent($scope.nameToSearch.toLowerCase()))

or i could have it hardcoded too
For the hardcoded version, just put it in quotes with escapes for the quotes and backslashes:
// Quotes v v
var str = '"ѯѰѱѲ & <b>BOLD</b> <>?:"{}|+_)(*&^%\\\\\\\\\\\\$##!~`,./;\'[]\\';
// Escapes -------------------------------------^-^-^-^-^-^-----------^---^

escape sequence javascript

How can I pass variable to other function in this condition ,
I'm inserting textarea through javascript with single quotes,
but when it gets called myFunction(abc123), it looks like this,
the function suppose to be like this when it is called - myFunction('abc123')
so what should i do ?
myNum=123;
focusVar = "abc"+myNum;
$("#myDiv").append('<textarea onFocus="onFocusReportReply('+focusVar+')" onBlur="onBlurReportReply()" id="replyReportText'+data.activityId1+'">')

$("#myDiv").append('<textarea onFocus="onFocusReportReply(\''+focusVar+'\')" onBlur="onBlurReportReply()" id="replyReportText'+data.activityId1+'">')
Backslashes escape special characters, in this case string delimiters.

You can either use double quotes or escaped single quotes.
var foo = 'onFocus=myFunc("' + focusVar + '") moar';
or
var foo = 'onFocus=myFunc(\'' + focusVar + '\') moar';
To escape special characters, you need a leading backslash. Examples are
\t (tabulator)
\n (line feed)
\\ (backslash)

Enclose your string inside single quotes, like this:
myNum=123;
focusVar = "'abc"+myNum+"'";

How to add single quote in the variable in Javascript?

I have variable var str as following:
var str = <option value="1">tea</option>;
I would like to make it as below
var quote_str = '<option value="1">tea</option>;'
Is there anyone can help me? Thanks in advance!
Edit:
I have tried the following code,however, it's not correct.
var quote_str = 'str';

I think that you want the semicolon outside the string literal:
var quote_str = '<option value="1">tea</option>';
If you mean that you want apostrophe characters inside the string also, you can use \' to put an apostrophe in a string delimited by apostrophes:
var quote_str = '\'<option value="1">tea</option>\'';
You can also use quotation marks to delimit the string. Then you don't have to escape the apostrophes, but you have to escape the quotation marks:
var quote_str = "'<option value=\"1\">tea</option>'";
If you already have a string, and want to add apostrophes around it, you concatenate strings:
var quote_str = "'" + str + "'";

Escape each single quote with a back-slash:
var quote_str = '\'<option value="1">tea</option>;\''
…or wrap the string in quotes of a different kind (i.e. double quotes), but be sure to escape the inner double quotes as to not unintentionally close the string:
var quote_str = "'<option value=\"1\">tea</option>;'"
late update: now we have template literals, so the whole thing becomes a breeze:
var quote_str = `'<option value="1">tea</option>;'`

You can escape characters in Javascript with the \. If that's your issue

We can use the backslash () escape character to prevent JavaScript from interpreting a quote as the end of the string.
The syntax of \' will always be a single quote, and the syntax of \" will always be a double quote, without any fear of breaking the string.
Using this method, we can use apostrophes in strings built with ".
'We\'re safely using an apostrophe in single quotes.' We can also use quotation marks in strings built with ".
"Then he said, \"Hello, World!\"";

In my case, i'm unable to use the notation of ${} in rendered Javascript inside Python Mako Templates as it's already using ${} for rendering variables in Mako:
# mako template somewhere
var quote_str = `'${str}'`;
So i just wrote a small function:
# app.js ( a real Javascript file )
function singlequote(text) {
return `'${text}'`;
}
And then I use:
# mako template somewhere
var quote_str = singlequote(str);
# So i'm able to also use something like:
let btn = '<button type="button" onclick="update(' + singlequote(myid) + "," + singlequote(mystate) + ')"> Update </button>';