如何在模态弹出窗口中显示 JSP 页面？

Question

我对 Jsp 的东西很陌生。我想要实现的是在 service.jsp 页面中显示另一个 jsp 页面的内容让我们说 help.jsp 但仅当用户单击时？图像（？图像代表帮助）。我想在弹出窗口中显示 help.jsp 的内容，同时还希望主屏幕淡出或非棘手。

这是我目前正在做的事情。我在 service.jsp 中创建了一个 div

<div id="dialog" title="Basic dialog">

</div>

并创建了一个 javascript 函数

function openDialog() {
        $("#dialog").load('/myaccount/registration/help.jsp').dialog({modal: true});
    }

我的锚标签看起来像这样

 <a tabindex="1005" href="#"  onclick="openDialog();" onMouseOver="window.status='Launch Help Window'; return true" onMouseOut ="window.status='';return true"><span class="WhiteBody"><img src="images/icon_help.gif" border="0"></span></a>

当我单击帮助按钮时，它会重定向到一个空白页面。

请帮我 ！

Answer 1

在您的 HTML 中，

<button id="myButton">click!</button>

<div id="dialog" title="Dialog box">
  My content // Have to add your jsp page here
</div>

在你的脚本中，

$(function() {

  $("#dialog").dialog({
     autoOpen: false,
     modal: true
   });

  $("#myButton").on("click", function(e) {
      e.preventDefault();
      $("#dialog").dialog("open");
  });

});

有关工作示例，请参阅Fiddle。