如何在 HTML 中实现没有状态栏和地址栏的弹出窗口？答案

【问题标题】：How to implement pop up window with no status bar and address bar in HTML?如何在 HTML 中实现没有状态栏和地址栏的弹出窗口？
【发布时间】：2014-12-07 19:44:41
【问题描述】：

我正在尝试在 Web 应用程序中实现弹出窗口，我发现以下资源非常有用

http://www.scriptfx.com/windows/plain/simple.htm#7

但是这里显示的所有示例都有以下

菜单栏/工具栏和地址位置。在我的 html 中，我调用高图表来绘制数据点。

html的结构

<html>
<body>
adding high chart plot by using div id. 
<script>
script for plotting plot using high chart
</script>
</body>

我真的不只需要html。我可以在弹出窗口中简单地做同样的事情。我如何生成一个没有此类栏的弹出窗口，即一个普通的 html，带有在单击按钮或交叉按钮时关闭窗口的选项。

【问题讨论】：

您希望弹出窗口从 URL 还是从 html div 获取内容？
我想从本地文件中读取 html。目前在我的代码中使用 URL（我是 web 开发的新手）如果有另一种使用 div 的方法我也可以使用它。

标签： html popup

【解决方案1】：

您无法更改浏览器弹出窗口的设计，从您的评论中您只想弹出一个简单的 html 代码，因此有很多使用 javascript 构建的易于使用的自定义模式（弹出窗口）。

尝试其中一种（只需简单搜索jquery modal window，您会发现很多）

编辑

你可以用这种方式显示你的对话框（jQuery UI）

    <div id="popup" title="Basic dialog" style="display:none;">
        <p>This is the default dialog which is useful for displaying information.</p>
    </div> 

    <!-- button to show -->
    <a href="javascript::void()" class="showModal">Click to Show</a>

javascript

    $(document).ready(function(){
    // show dialog on click
     $('.showModal').click(function(){
          $('#popup').dialog({width: 600,height: 600});
      });
    });

【讨论】：

我已经编辑了我的问题，JQuery UI 对话框非常有用，但它有固定的尺寸。如果我增加维度，则会出现滚动条。我怎样才能避免滚动条。
@user15662 不是它没有固定尺寸你可以改变宽度和高度只需改变配置见stackoverflow.com/questions/5625835/…
@user15662 你可以这样做$('yourelement').dialog({width: 600,height: 600});
感谢它的工作！但是如何在单击文本时使用此对话框。
我使用了相同的标签，但是 onclick 没有输出。我在这里上传了相同的filedropper.com/output_3。你能检查一下我哪里错了吗？

【解决方案2】：

您根本无法在 HTML 中设置窗口属性。您在 HTML 中创建弹出窗口所能做的就是使用 target="_blank" 属性，但它只建议在新的浏览上下文中打开链接，这可能是一个新窗口，但现在它更经常是一个新的标签。

您指的是 JavaScript 代码，而不是 HTML。有许多资源，包括 SO 问题和答案，以这种方式打开窗口，以及不这样做的原因以及使用更高级的方法（如模态对话）。

【讨论】：