pop une page html ou fenêtre pour afficher une réponse

Question

Je suis une réponse d'un serveur, le format de texte de la réponse est

"<div class=\"esv\"><h2>John 3:16 <object type=\"application/x-shockwave-flash\" data=\"http://www.esvapi.org/assets/play.swf?myUrl=hw%2F43003016\" width=\"40\" height=\"12\" class=\"audio\"><param name=\"movie\" value=\"http://www.esvapi.org/assets/play.swf?myUrl=hw%2F43003016\" /><param name=\"wmode\" value=\"transparent\" /></object></h2>\n<div class=\"esv-text\"><h3 id=\"p43003016.01-1\">For God So Loved the World</h3>\n<p id=\"p43003016.07-1\"><span class=\"verse-num woc\" id=\"v43003016-1\">16&nbsp;</span><span class=\"woc\">&#8220;For God so loved the world,<span class=\"footnote\">&nbsp;<a href=\"#f1\" id=\"b1\" title=\"Or 'For this is how God loved the world'\">[1]</a></span> that he gave his only Son, that whoever believes in him should not perish but have eternal life.</span> (<a href=\"http://www.esv.org\" class=\"copyright\">ESV</a>)</p>\n</div>\n<div class=\"footnotes\">\n<h3>Footnotes</h3>\n<p><span class=\"footnote\"><a href=\"#b1\" id=\"f1\">[1]</a></span> <span class=\"footnote-ref\">3:16</ 
    span> Or <em>For this is how God loved the world</em>\n</p>\n</div>\n</div>" 

Le format HTML aime

Tous compétence peut apparaître ce message en javascript ou jquery?

Answer 1

Si vous voulez une jolie pop-up au milieu de votre écran (pas le javascript standard popups alerte), puis ...

Pour la div vous avez ci-dessus, vous pouvez

1) Position au centre de votre écran (lire http://www.jakpsatweb.cz/css/css-vertical-center-solution.html) Vous voudrez peut-être styler le div avec position: fixed;, selon la façon dont votre site est configuré. Réglez également z-index: 999; ou un autre nombre élevé.

2) le cacher. Par exemple, dans le CSS mis .esv {display: none}

3) en utilisant jQuery/javascript, afficher quand un événement quelconque se produit que vous voulez

$("#somebutton").click(function(){ 
     $(".esv").show(); // will display the popup window 
    } 

Ceci est un modèle très simplifié. Mais quelque chose dans ce sens pourrait être ce que vous voulez.
Si vous voulez avoir un contenu différent à chaque fois, alors vous pouvez d'abord avoir votre <div class="esv"></div> vide. Ensuite, utilisez jQuery pour insérer ce que vous désirez avant show(). Cependant, vous devrez rechercher comment sélectionner dynamiquement tout ce que vous insérez.

donc l'étape 3 pourrait ressembler à ceci: