I'm new to HTML and javascript. When I try to initiate a popup window, I find the usual way to do is like this:

var popup = new Popup(title, content);

where content is string of html containing the content of the popup box, such as

var content = "<div> \
<input type='text'> \
</div> "

This writing style is really ugly, and when the content gets plex, the code is hardly readable. What's the good practice for doing this?

Edit By popup I didn't mean a new browser window, but something like when you click on a pin on Google map, detailed information about that pip will pop up.

I'm new to HTML and javascript. When I try to initiate a popup window, I find the usual way to do is like this:

var popup = new Popup(title, content);

where content is string of html containing the content of the popup box, such as

var content = "<div> \
<input type='text'> \
</div> "

This writing style is really ugly, and when the content gets plex, the code is hardly readable. What's the good practice for doing this?

Edit By popup I didn't mean a new browser window, but something like when you click on a pin on Google map, detailed information about that pip will pop up.

• javascript
• html

• You could have the popup content on the html page and just toggle showing or hiding it, or just copy it directly – Explosion Pills Commented May 10, 2013 at 14:46

2 Answers 2

I'd suggest using a hidden div with the text you want to display and then reading it and putting into Popup - something like

<div id="myPopup" style="display: none;">Popup content</div>
<script>

  var x=document.getElementById("myPopup");
  var p = new Popup(title, x.innerHTML);

</script>

It will be best to open an html page as a popup. Please take a look at http://www.quirksmode/js/popup.html and http://www.yourhtmlsource./javascript/popupwindows.html

This case you can add some inputs, or other html elements inside the popup and even implement logic in the popup page.