在一个PHP页面中包含多个带有JavaScript的HTML页面

Question

早些时候我问过有关固定时钟和BAM的问题！ 解决方案几乎是即时的。 从那时起，我已经成功地将几个时钟添加到一个PHP页面。 一个给东京，一个给伦敦，一个给马德里，一个给丹佛-太好了。 我的问题（现在）是，我能够做到这一点的唯一方法是“包括”真正由以下HTML组成的各个PHP页面。 如果在PHP页面上“查看源代码”，则会看到其中嵌入的多个HTML页面，其中包括打开和关闭HTML，head和body标签。

我的问题：可以将多个HTML页面彼此嵌入吗？ 它可在所有主要浏览器（ Google Chrome ，Firefox，Internet Explorer， Safari和Opera ）上运行。 我应该以不同的方式去做吗？ 我似乎无法在PHP文件的头中调用标头信息并使之正常工作（特别是对jQuery＆scripts / jclock.js的调用）。 只要它在第一个时钟上加载，就不必在随后的时钟上加载，但是我似乎无法摆脱HTML，只是每个时钟使用JavaScript代码并回显' <div id='us_pacific"></div> '（时钟是如何在body标签内的HTML中打印到页面的。）

有什么想法吗？

这是时钟：

<html>
    <head>
        <script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
        <script type="text/javascript" src="scripts/jclock.js"></script>
        <link rel="stylesheet" href="css/homepage.css">
        <script type="text/javascript">
            $(document).ready(
                function() {
                    if ($('#us_pacific .time').length>0){
                       $('#us_pacific .time').remove();
                    }

                    //Set the offset here
                    var offset = -7;
                    if (offset == '')
                        return;
                    $('#us_pacific').append('<div class="time"></div>');
                    var options = {
                        format:'<span class=\"dt\">%a, %d %b %H:%M</span>',
                        timeNotation: '12h',
                        am_pm: true,
                        utc:true,
                        utc_offset: offset
                    }
                    $('#us_pacific .time').jclock(options);
                });
        </script>
    </head>
    <body>
        <div id="us_pacific"></div>
    </body>
</html>

Answer 1

对您的问题：“ 可以将多个HTML页面相互嵌入吗？ '，答案是：不，您不能在一个文档中包含多个html标记，这将是无效的文档。

假设jclock.js编码正确，则它应该能够驱动多个实例。

然后，您将在HTML中添加一些额外的div容器，并稍微修改JavaScript代码（请查看其他版本），以使用自己的选项设置额外的时钟。

您可以将代码更改为此（并根据需要对其进行重构）：

<html>
    <head>
        <script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
        <script type="text/javascript" src="scripts/jclock.js"></script>
        <link rel="stylesheet" href="css/homepage.css">
        <script type="text/javascript">
            $(document).ready(
                function() {
                    var options; // This way you can re-use it without the 'var' keyword.

                    // Timezone 1
                    if ($('#us_pacific .time').length>0){
                        $('#us_pacific .time').remove();
                    }
                    $('#us_pacific').append('<div class="time"></div>');
                    options = {
                        format: '<span class=\"dt\">%a, %d %b %H:%M</span>',
                        timeNotation: '12h',
                        am_pm: true,
                        utc: true,
                        utc_offset: -7  // Now set the offset here
                    };
                    $('#us_pacific .time').jclock(options);

                    //Timezone 2
                    if ($('#eu .time').length>0){
                        $('#eu .time').remove();
                    }
                    $('#eu').append('<div class="time"></div>');
                    options = {
                        format: '<span class=\"dt\">%a, %d %b %H:%M</span>',
                        timeNotation: '12h',
                        am_pm: true,
                        utc: true,
                        utc_offset: 1  // Now set the offset here
                    };
                    $('#eu .time').jclock(options);
                });
        </script>
    </head>
    <body>
        <div id="us_pacific"></div>
        <div id="eu"></div>
    </body>
</html>

我希望这有帮助！

在一个PHP页面中包含多个带有JavaScript的HTML页面

问题描述

1 个解决方案

解决方案1
0 已采纳 2013-04-20 04:03:59

在一个PHP页面中包含多个带有JavaScript的HTML页面

问题描述

1 个解决方案

解决方案1 0 已采纳 2013-04-20 04:03:59

解决方案1
0 已采纳 2013-04-20 04:03:59