passing arbitrary html to a popup window

Question

I am calling my makewindows fuction from a php file like so:

echo "<a href='#' onclick=\"makewindows(" . $html . "); return false;\">Click for full description </a></p>";

This generates correct html, which results in a popupwindow containing the html from $html. For example(most of the html has been snipped):

<a href="#" onclick="makewindows(&quot;<P align=center><SPAN style=\&quot;FONT-FAMILY: Arial\&quot;>&quot;); return false;">Click for more</a>

Now, I want to make an image above the link clickable, to display an image instead of html, using the same method.

I made an $imagehtml variable in php like so:

$imagehtml = "<img src='".$imageSrc."' >";

$imageSrc is the result of another method, but is always without fail a valid url for an image

passing $imageHtml to makewindows should work(the fact that it is not standards complaint html is irelivant, at least as to why what I am trying is failing. The same single line of html in a standalone html file displays in every browser fine.)

this results in the following html:

<a href="#" onclick="makewindows(<img src='removed.jpg' >); return false;">
<img src="removed.jpg" width="250" height="250"></a>

This completely fails. It has nothing to do with the image path, as no window is created at all. All I am doing is changing the variable passed, surely the window should still be created, regardless of the contents of the html?

this fails even if trying to pass about:blank, for example defining imagehtml as follows:

$imagehtml = "about:blank";

results in:

<a href="#" onclick="makewindows(about:blank); return false;">Click for full description </a>

yet still no window.

Answer 1

You’re probably doing something wrong.

Let’s say you want to pass this HTML to a JavaScript function call inside an HTML attribute:

<img src="removed.jpg" width="250" height="250">

Then doing this is enough:

$html = '<img src="removed.jpg" width="250" height="250">';
echo '<a href="#" onclick="makewindows(' . htmlspecialchars(var_export($html, true), ENT_QUOTES) . '); return false;">Click for full description</a></p>';

The var_export function converts the value into an (PHP) equivalent expression and the htmlspecialchars function finally converts the HTML meta characters into character references.

This might not be the most elegant way, but it works.

Answer 2

You want something like this:

$str = '<img src="...">';

echo '<a href="#" onclick="makewindows('
    . htmlspecialchars(json_encode($str))
    . '); return false;">Click for full description</a></p>';

This will do the correct encoding / escaping.