We Keep Coding

How to escape string in onClick="function(string)"

I have to echo a string that could contain everything into the following html line:
...
I don't know how to properly escape the string I pass with php, there seem to be many problems and json_encode is not working as it wraps the output in double quotes which is not working as the double quotes already begin after "onclick=".
Just replacing single quotes also doesn't work as "\'" would be replaced to "\'".
Any ideas?

you can use addslashes() function.
Try this:
<?php
$str = addslashes('What does "yolo" mean?');
echo($str);
?>

Use PHP addslashes function:
...

As none of the answers worked, I had a closer look at the problem and came up with this solution:
function clean_param($string){
// escapes all single quotes and backslashes
$single_qu_esc = addcslashes($string, "'\\");
// escapes the resulting string for html
return htmlentities($single_qu_esc, ENT_QUOTES);
}

you can wrap your string with htmlspecialchars, that should do the job.
...

Backslash does not escape double quotes

The following string shows double quotes and backslsh when runs:
"<img src=\"abc/xyz/"
What am I doing wrong?
Thanks

Not sure where you are using it, but a simple solution use single quotes on outside and remove backslash.
'<img src="abc/xyz" />'

If this is your full string, it isn't complete. There's no closing quote " nor > bracket
This would be a valid <img> element string
"<img src=\"abc/xyz/\">"

What is a proper way to escape HTML for Javascript function?

I'm getting Uncaught SyntaxError: Unexpected identifier
due of the Java-Script clashing syntax or single and double quote.
In the source file,the $str is escaped as special chars but not sure why Javascript will hit error.
What is the Correct/Proper way to escape it with single or double quote inside a string for Javascript function use purpose?
Below is my code :
<?php
$str = 'I\'m John Doe < lol > "19" ! ?';
?>
<div onclick="alert('<?php echo htmlspecialchars($str); ?>')">Test</div>
<div onclick="alert("<?php echo htmlspecialchars($str); ?>")">Test</div>

The important thing to note here is that you don't just have JavaScript. You have JavaScript in an HTML attribute, so you have to escape for JS then for HTML.
json_encode will escape for JS. It will also add quotes around strings, so do you don't need to do that yourself.
htmlspecialchars will escape for HTML.
onclick="alert(<?php echo htmlspecialchars( json_encode( $str ) ); ?>"

Any time you're using strings in the context of JavaScript, use JSON-encoding. JSON is compatible with JavaScript parsers, and all of the escaping needed will be done for you.
var str = <?php json_encode($str) ?>;

Apart from PHP or JavaScript is there any escape character for browsers?

I have a hidden field that stores value retrieved from the database as given below:
echo '<input type="hidden" value="'.$str.'">';
The problem is that if $str contains text having double quotes, it definitely causes problem for the browser to display accordingly. But using escape character \ in PHP is in vain. Also I tried this:
$str = str_replace('"',"'",$str);
Then I have to replace every single quotes into double (doing the reverse) in the client:
str = str.replace(/'/g,'"');
Although it works fine for me,still it doesn't get rid of bugs. For example, if the original string from the database contains single quote (') , it will also get replaced by double quote (") in the client which is unexpected. So, is there any alternative solution to this problem or is there really any escape character for browsers that can be put in the double quotes in the hidden field?

You can use htmlentities to escape the value
http://php.net/manual/en/function.htmlentities.php
e.g.
echo '<input type="hidden" value="'.htmlentities($str).'">';

How do I escape a single quote ( ' ) in JavaScript? [duplicate]

This question already has answers here:
Why are inline event handler attributes a bad idea in modern semantic HTML?
(3 answers)
Single quote escape in JavaScript function parameters
(7 answers)
Closed 9 years ago.
UPDATE:
I want to give an updated answer to this question. First, let me state if you're attempting to accomplish what I have below, I recommend that you manage events by adding event listeners instead. I highly recommend that you utilize jQuery for your project and use their syntax to manage event listeners over using DOM.
QUESTION
Okay, I am basically doing this:
document.getElementById("something").innerHTML = "<img src='something' onmouseover='change(\'ex1\')' />";
I don't want double quotes (") where I put the \'. I only want a single quote, so I am trying to not make it put a double when it is used. I am trying to reach this in the final outcome.
<img src="something" onmouseover="change('ex1')" />
Escaping isn't working for me.
My marked answer works fine, however, the cleaner (and more professional-looking way, IMO) is loganfsmyth's answer.

You should always consider what the browser will see by the end. In this case, it will see this:
<img src='something' onmouseover='change(' ex1')' />
In other words, the "onmouseover" attribute is just change(, and there's another "attribute" called ex1')' with no value.
The truth is, HTML does not use \ for an escape character. But it does recognise " and &apos; as escaped quote and apostrophe, respectively.
Armed with this knowledge, use this:
document.getElementById("something").innerHTML = "<img src='something' onmouseover='change("ex1")' />";
... That being said, you could just use JavaScript quotes:
document.getElementById("something").innerHTML = "<img src='something' onmouseover='change(\"ex1\")' />";

The answer here is very simple:
You're already containing it in double quotes, so there's no need to escape it with \.
If you want to escape single quotes in a single quote string:
var string = 'this isn\'t a double quoted string';
var string = "this isn\"t a single quoted string";
// ^ ^ same types, hence we need to escape it with a backslash
or if you want to escape \', you can escape the bashslash to \\ and the quote to \' like so:
var string = 'this isn\\\'t a double quoted string';
// vvvv
// \ ' (the escaped characters)
However, if you contain the string with a different quote type, you don't need to escape:
var string = 'this isn"t a double quoted string';
var string = "this isn't a single quoted string";
// ^ ^ different types, hence we don't need escaping

You can escape a ' in JavaScript like \'

Since the values are actually inside of an HTML attribute, you should use '
"<img src='something' onmouseover='change(&apos;ex1&apos;)' />";

document.getElementById("something").innerHTML = "<img src=\"something\" onmouseover=\"change('ex1')\" />";
OR
document.getElementById("something").innerHTML = '<img src="something" onmouseover="change(\'ex1\')" />';
It should be working...