0 
<html>
<head>
  <link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" type="text/css"/>
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
  <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>
<%
String str ="Ravi";
%>
 <script>
function changeIt(_src)
{
  $("#dialog").dialog();
}
 </script>

</head>
<body >
<img onclick="changeIt(this)" src='Cham/ravi.jpg' name='myimage' height ="100" width="100"  />
<div id="dialog" title="Dialog Title">
The Name is <%=str%>
<img  src='Cham/ravi.jpg' name='myimage' height ="1000" width="1000"  />
</div>
</body>
</html>

你好 ，

在页面启动时，在 AJAX 调用中，我有一些图像存在于一个文件夹中，我将获取这些路径并将它们显示在 UI 页面上。

现在，在 UI 页面上单击该图像时，我试图显示一个 Jquery 对话框，该对话框必须包含数据库中与该图像详细信息相关的一些数据，以及更大尺寸的该图像（已单击）。（基本上是一个POP UP）

当我在对话 div 中也包含图像时，它看起来很尴尬，因为图像仅在页面加载时加载。

如果这不是在富网站上显示弹出窗口的更好方法，因为您是 UI 专家，您能否告诉我最好的方法是什么？我不确定灯箱是否适合我的要求，请建议我。提前致谢

4

1 回答 1

1

我不太明白你的问题，但至少我想在这里提供帮助..

要修复您的代码，这里是工作示例。不要忘记在您的页面中包含 jqueryUI。

<img class="thumbnail" src='Cham/ravi.jpg' name='myimage' height ="100" width="100"  />

<div id="dialog" title="Dialog Title">
The Name is <%=str%>
<img  src='Cham/ravi.jpg' name='myimage' height ="1000" width="1000"  />
</div>

$(document).ready(function(){
    $('#dialog').dialog({autoOpen :false});
});

$('.thumbnail').on('click', function() {
    $('#dialog').dialog('open');
});​

另外，如果我没有误解你的问题，这个插件就是你要找的。

于 2012-04-23T15:57:01.197 回答