Javascript弹出窗口已更新

Javascript pop-up window -updated

本文关键字：已更新 窗口 Javascript      更新时间：2023-09-26

我从" www.hotscripts.com "， http://www.advancebydesign.com/itemdetails.php?item=15复制了这段代码。它所做的只是在屏幕中间显示一个简单的窗口。

需要三个非常简单的步骤:

1)创建按钮<input type="button" onclick='Javascript:my_box.Show();' value="Show Popup Box">

2)将其纳入标题<script language="Javascript" type="text/Javascript" src="jscpopupbox.js"></script>

3)，也添加到头部:

my_box = new jscPopupBox();
my_box.width = 400;
my_box.height = 450;
content_html = "<div style='"padding:0;height:30px;margin:0;border:none;";
content_html+= "background-color:#CCF;clear:both;'"><input type='"button'" ";
content_html+= "style='"float:right;height:26px;width:26px;'" value='"X'" ";
content_html+= "onclick='my_box.Hide();'></div>'n";
content_html+= "<iframe src='"../license.txt'" width='"100%'" style='"";
content_html+= "border:none;padding:0;margin:0;'" height='"420px'"></iframe>";
my_box.html = content_html;

我不明白的是为什么我的网站上的窗口出现在左上角，而不是在中间。我没有接触源代码，当我在一个普通的HTML页面上尝试它时，它似乎可以工作。我的CSS干扰了吗?

我从我的网站上删除了所有的CSS，最终我发现问题不在于它，而是这个页面顶部的<!DOCTYPE HTML>。这与javascript部分有什么关系?声明部分不是告诉浏览器正在读取哪个页面吗?不管怎样，当我删除它时，一切都很好。(顺便说一下，我的网页包含HTML5视频)

尝试更改

content_html = "<div style='"padding:0;height:30px;margin:0;border:none;";


content_html = "<div style='"padding:0;height:30px;margin:auto;border:none;";

doctype告诉浏览器要使用哪个版本的HTML规范，使用特定doctype的不同浏览器可能会得到不同的结果。

一些文档类型期望所有的标签关闭，做/不使用自关闭标签等

一般来说，这只会影响你的HTML，但如果你的JS正在创建HTML，那么它可能会间接受到影响

对于创建显示或隐藏的弹出窗口来说，这是一种过度技巧。

通常只包括你想要用默认的CSS类display:none来显示的DIV，然后添加一个新的类display:block或更干净地使用Jquery来切换类

您可能想尝试更复杂的doctype定义。您可以在这里找到来自W3C的信息:http://www.w3.org/QA/2002/04/valid-dtd-list.html

另外，我的一些xhtml页面在最上面使用xml定义头:像这样开始:

    <?xml version="1.0" encoding="ISO-8859-1"?>
    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
       "http://www.w3.org/TR/html4/frameset.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
相关文章：