이 jQuery Twice를 같은 페이지에 어떻게 추가 할 수 있습니까?

Question

WordPress 플러그인에 의해 생성 된이 코드를 두 번 동일한 페이지에 추가하려고합니다. 그러나 두 번째로 카운트 다운 타이머를 생성하지는 않습니다 .... 나타나는 간단한 변경 사항이 있습니까? 두번?

고맙습니다!

<script type="text/javascript"> 
<!-- 
jQuery(document).ready(function($){ 
    var austDay = new Date("2012/02/11 00:00"); 
    jQuery.countdown.regional["uji"] = { 
     labels: ["Years", "Months", "Weeks", "Days", "Hours", "Minutes", "Seconds"], 
     labels1: ["Year", "Month", "Week", "Day", "Hour", "Minute", "Second"], 
     compactLabels: ["A", "L", "S", "Z"], 
     whichLabels: null, 
     timeSeparator: ':', 
     isRTL: false 
    }; 
    jQuery.countdown.setDefaults(jQuery.countdown.regional["uji"]); 
    jQuery("#ujiCountdown").countdown({until: austDay, text_size: '55', color_down: '#3A3A3A', color_up: '#635b63', color_txt: '#FFFFFF', color_sw: '#000000', ujic_txt: true, animate_sec: true}); 
    jQuery("#ujiCountdown").css({"width": (jQuery("#ujiCountdown").width()-10)+"px", "padding-left": "30px"}); 
}); 
//--> 
</script> 

<div id="ujiCountdown" class="ujic_center"></div> 

Answer 1

두 개 이상의 페이지를 페이지에서 가져 오려면 다른 DOM 요소에 두 번째 페이지를 할당해야합니다. 다른 ID로 두 번째 div를 만들 수 있습니까? 그런 다음 두 번째 div에서 jQuery 코드를 호출 할 수 있으며 둘 다 다르므로 둘 다 표시됩니다.

<div id="ujiCountdown2"></div> 

다음 동일한 준비 블록에 당신은

jQuery("#ujiCountdown2").countdown({until: austDay, text_size: '55', color_down: '#3A3A3A', color_up: '#635b63', color_txt: '#FFFFFF', color_sw: '#000000', ujic_txt: true, animate_sec: true}); 

Answer 2

ID를 변경해야합니다.

<script type="text/javascript"> 

    <!-- 
       jQuery(document).ready(function($){ 
        var austDay = new Date("2012/02/11 00:00"); 
        jQuery.countdown.regional["uji"] = { 
         labels: ["Years", "Months", "Weeks", "Days", "Hours", "Minutes", "Seconds"], 
         labels1: ["Year", "Month", "Week", "Day", "Hour", "Minute", "Second"], 
         compactLabels: ["A", "L", "S", "Z"], 
         whichLabels: null, 
         timeSeparator: ':', isRTL: false}; 
        jQuery.countdown.setDefaults(jQuery.countdown.regional["uji"]); 
        jQuery("#ujiCountdown1").countdown({until: austDay, text_size: '55', color_down: '#3A3A3A', color_up: '#635b63', color_txt: '#FFFFFF', color_sw: '#000000', ujic_txt: true, animate_sec: true}); 
        jQuery("#ujiCountdown1").css({"width": (jQuery("#ujiCountdown").width()-10)+"px", "padding-left": "30px"}); 
        }); 
    //--> 
    </script><div id="ujiCountdown1" class="ujic_center"> 


<script type="text/javascript"> 

    <!-- 
       jQuery(document).ready(function($){ 
        var austDay = new Date("2012/02/11 00:00"); 
        jQuery.countdown.regional["uji"] = { 
         labels: ["Years", "Months", "Weeks", "Days", "Hours", "Minutes", "Seconds"], 
         labels1: ["Year", "Month", "Week", "Day", "Hour", "Minute", "Second"], 
         compactLabels: ["A", "L", "S", "Z"], 
         whichLabels: null, 
         timeSeparator: ':', isRTL: false}; 
        jQuery.countdown.setDefaults(jQuery.countdown.regional["uji"]); 
        jQuery("#ujiCountdown2").countdown({until: austDay, text_size: '55', color_down: '#3A3A3A', color_up: '#635b63', color_txt: '#FFFFFF', color_sw: '#000000', ujic_txt: true, animate_sec: true}); 
        jQuery("#ujiCountdown2").css({"width": (jQuery("#ujiCountdown").width()-10)+"px", "padding-left": "30px"}); 
        }); 
    //--> 
    </script><div id="ujiCountdown2" class="ujic_center"> 

Answer 3

다른 div를 추가해야합니다. 두 번째로 함수를 실행할 때 동일한 div에서 계속 작동합니다. 다른 DIV를 추가

<div id="ujiCountdown2" class="ujic_center"></div> 

그 다음 JS에서 함수의 아래쪽에 다음 라인을 변경

jQuery("#ujiCountdown, #ujiCountdown2").countdown({until: austDay, text_size: '55', color_down: '#3A3A3A', color_up: '#635b63', color_txt: '#FFFFFF', color_sw: '#000000', ujic_txt: true, animate_sec: true}); 
jQuery("#ujiCountdown, #ujiCountdown2").css({"width": (jQuery("#ujiCountdown").width()-10)+"px", "padding-left": "30px"}); 

나서 JQuery와 방법 모두 div에 적용하자.