javascript - What's the good practice to add html content of popup box in JS code? - Stack Overflow

admin管理员组

文章数量:1404927

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

Share Improve this question Follow edited Aug 30, 2020 at 21:25 HoldOffHunger 21k1111 gold badges120120 silver badges146146 bronze badges asked May 10, 2013 at 14:42 DongDong 33233 silver badges1010 bronze badges 1

• 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

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 5

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.

本文标签： javascriptWhat39s the good practice to add html content of popup box in JS codeStack Overflow