0

我想在 HTML 页面上创建一个链接，这样当用户点击它时，就会出现一个带有特定图像的“弹出窗口”。现在，主要的是我不希望这个弹出窗口成为浏览器中的新选项卡/窗口。我希望它成为页面本身的一部分。如果弹出窗口可以像单独的窗口一样在页面上移动，那就太好了。

是否有可以实现此目的的 JavaScript/JQuery 库？

4

3 回答 3

2

jQueryUI 对话框正是您正在寻找的。

您可以在 DIV 中定义弹出“窗口”，如下所示：

<div id="dialog" title="Basic dialog">
    <p>This is the default dialog which is useful for displaying information. The dialog window can be moved, resized and closed with the 'x' icon.</p>
</div>

然后，当用户单击链接时，您可以通过 jQuery 显示对话框，如下所示：

<script>
    $("#YourLink").click(function(e) {
        e.preventDefault();
        $("#dialog").dialog();  
        return false;  
    });  
</script>
于 2013-09-06T02:08:42.137 回答
2

这应该这样做：http: //jsfiddle.net/55DBx/1/

利用 jQuery 和 jQuery UI。祝你好运！

jQuery：

$( "#dialog" ).dialog({ autoOpen: false });
$( "#btnExample" ).click(function() {
  $( "#dialog" ).dialog( "open" );
});

html:

<button id="btnExample">open the dialog</button>
<div id="dialog" title="Dialog Title">I'm a dialog</div>
于 2013-09-06T03:30:22.780 回答
1

您可能想看看 Bootstrap 模态：http://getbootstrap.com/javascript/#modals

或 jquery ui 对话框：http: //jqueryui.com/dialog/

于 2013-09-06T02:09:21.530 回答