2013-04-20 2 views
1

이전에 나는 아래의 시계 수정과 BAM에 대해 물었습니다! 해결책은 거의 즉각적이었습니다. 그 이후로 나는 이러한 PHP 시계에 여러 개의 시계를 성공적으로 추가했습니다. 하나는 도쿄, 하나는 런던, 하나는 마드리드, 다른 하나는 덴버입니다. 내 문제는 (지금) 나는 이것을 할 수 있었던 유일한 방법은 실제로는 아래의 HTML으로 구성된 개별 PHP 페이지를 "포함"하는 것입니다. PHP 페이지에서 "소스보기"를 사용하면 HTML, 머리 및 본문 태그를 열고 닫을 수있는 HTML 페이지가 여러 개 표시됩니다.JavaScript가 포함 된 여러 HTML 페이지를 하나의 PHP 페이지에 포함하십시오.

내 질문 : 여러 HTML 페이지가 서로 포함되도록해도 괜찮습니까? 모든 주요 브라우저 (Google Chrome, Firefox, 인터넷   탐색기, SafariOpera)에서 작동합니다. 이 일을 다른 방식으로해야할까요? 내 PHP 파일의 머리 부분에서 헤더 정보를 호출하여 작동시키지 못하는 것 같습니다 (특히 jQuery & 스크립트/jclock.js 호출). 그것은 첫 번째 시계에로드하는만큼 그것은 다음 것들에 필요하지 않습니다,하지만 HTML을 없애고 그냥 클럭마다 자바 스크립트 코드를 사용하여 '<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> 

답변

0

: 여기

는 시계입니다 ' 는 서로에 내장 된 여러 HTML 페이지가 확인입니까? '이면 대답은 다음과 같습니다. 아니요, 하나의 문서에 여러 개의 html 태그를 사용할 수 없으면 잘못된 문서가됩니다.

jclock.js이 올바르게 코딩되었다고 가정하면 여러 인스턴스를 구동 할 수 있어야합니다.

그런 다음 추가 컨테이너 div을 HTML에 추가하고 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> 

을 나는 희망이 도움이!

+0

방문자가 원하는 시계를 선택할 수있는 옵션을 제공하므로 표시되는 시계는 선택에 따라 달라집니다. 포함 된 파일은 if else statment를 기반으로 호출되므로 필요한 모든 코드를 (제안에 따라) 한 페이지에 넣을 수는 없습니다. 왜이 코드에서 html 태그를 제거하고 각 시계를 자체 페이지에 저장할 수 없습니까? 이것이 더 효과적으로 작동하지 못하게 막는 이유는 무엇입니까? – LyleCrumbstorm

+0

모두 긁어 라! 나는 한 발짝 물러서서 당신의 제안을 소화했습니다. 해결 방법 - 모든 시계를 하나의 .js 파일에 넣고 if else 구문을 기반으로 필요한 div를 에코합니다. 이제는 jQuery에 대한 호출이 1 개 뿐이며 1 .js 파일에 대한 호출은 1 개 ... 아름답습니다! 고맙습니다! – LyleCrumbstorm

+0

글쎄, 당신의 PHP 스크립트는 자바 스크립트의 일부를 에코 수 있습니다. 따라서 현재 전체 HTML 페이지를 하나에 통합/결합하는 경우에는 차이점 ('\\ timezone 2'참조)을 포함시켜 HTML에 여분의 container-div를 표시 할 수 있습니다. 당연히 자바 스크립트 (그냥 몇 가지 옵션과 호출) 리팩토링하는 것이 더 좋을 것이며, PHP는 필요한 자바 스크립트 호출과 그 옵션을 하나의 단순한 라인으로 작성하고, 아마도 2를 포함하는 div를 동적으로 생성 할 수 있습니다. . 더 나은 것은 PHP 함수를 제공하는 시간대가있는 테이블에 데이터를 저장하는 것입니다. – GitaarLAB

관련 문제