问答博客资讯标签用户活动
logo极客观点logo项目管理logoHarmonyOS
开发者社区
javascript
前端
python
node.js
react
vue.js
php
laravel
go
人工智能
mysql
linux
ios
java
android
css
typescript
spring
程序员
logoONES 研发管理logo思否企业问答logo安谋科技 XPU

你如何在对话框中打开一个 URL JQUERY UI

社区维基
1
新手上路，请多包涵

很长一段时间以来，我一直在寻找一个简单的解决方案。我想要一个页面（例如 http://www.google.com ）显示在 JQuery UI 对话框窗口中。计划是稍后动态添加 URL，以便我站点的所有链接都将显示在所述窗口中。

我尝试了以下操作，但单击链接时对话框窗口为空。

 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Test</title>

<meta charset="utf-8" />
  <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.1/themes/base/jquery-ui.css" />
  <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
  <script src="http://code.jquery.com/ui/1.10.1/jquery-ui.js"></script>
  <script>
$(document).ready(function() {
    $('#openwindow').each(function() {
        var $link = $(this);
        var $dialog = $('<div></div>')
            .load($link.attr('href'))
            .dialog({
                autoOpen: false,
                title: $link.attr('title'),
                width: 500,
                height: 300
            });

        $link.click(function() {
            $dialog.dialog('open');

            return false;
        });
    });
});
  </script>

</head>
<body>
<a id="openwindow" href="http://www.google.com">Click me to test.</a>
</body>
</html>

我找到了一些例子，但没有一个真正起作用。我真的很感激一些帮助。

提前致谢。

原文由 Daniel Saad 发布，翻译遵循 CC BY-SA 4.0 许可协议

Stack Overflow 翻译jqueryhtmljquery-uijquery-ui-dialog
阅读 531
1 个回答
得票最新
社区维基
1

您不需要 iframe 如所建议的那样，但您应该在 此处 阅读有关对话框的文档。

相反，您需要在 .open 属性上加载内容 –

 $( "#openwindow" ).dialog({
 open: function(event, ui) {
   $('#divInDialog').load('test.html', function() {
     alert('Load was performed.');
   });
  }
});

此外，您似乎将 .each 与 id 一起使用 —— id 在页面中应该是唯一的。使用 class 代替。

原文由 Nick Andriopoulos 发布，翻译遵循 CC BY-SA 3.0 许可协议

撰写回答
你尚未登录，登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进，让解决方法与时俱进
推荐问题