Let's examine your first example
onclick="alert('<?echo $row['username']?>')"
The important part here is, that everything outside of <? … ?> is pure HTML and never looked at by the PHP interpreter. Therefore, the only part that is relevant for PHP is the code inside <? … ?>, namely echo $row['username']. Here, one does not need to do any escaping.
Your second example, in contrast
echo('<button type="button" id="button'.$ctr.'"onClick="showMapsInfo(\''.str_replace("'", "\\'", $maps_name).'\', \''.str_replace("'", "\\'", $ctr).'\');"><img src="img/maps_logo.gif"></button><br/>');
is written purely in PHP, no surrounding HTML. Therefore, you have to be careful with the quotes. Let's build this up from scratch to see what happens here. When you build something like this, you would probably start with
echo('<button type="button" id="button1" onClick="showMapsInfo(\'...\');"><img src="img/maps_logo.gif"></button><br/>');
Because the single quotes were already used as string delimiters, they must be escaped inside the string with \'. Now for the part inside the javascript function. Put even simpler, the above code boils down to
echo('showMapsInfo(\'...\');');
which results in
showMapsInfo('...');
when we want to insert some dynamic parts instead of the '...' part, we need to end the string with ' and concatenate it back together with .. Suppose you wanted to insert a variable $foobar in there, then you would write:
echo('showMapsInfo(\''.$foobar.'\');');
which results in
showMapsInfo('<VALUE OF $foobar>');
Your example does not insert $foobar into this string, but rather the following expression:
str_replace("'", "\\'", $maps_name).'\', \''.str_replace("'", "\\'", $ctr)
Which uses str_replace in order to again escape the content, but with a little twist: It is not escaped for PHP, but for the resulting Javascript! Every single quote ' becomes an escaped single quote \' in the output, but you need to write \\' because the backslash needs to be escaped itself, in order to produce a backslash as output.
