时间戳

首页 > 解决方案 > Div dissapears after I add script

javascript - Div dissapears after I add script

问题描述

I have been trying to create an auto refreshing clock on my page but after adding script to my file the div around the clock dissapears so it doesn't use the CSS I have added to the div. <div class="clock_item"> is the one that disapears.

If I close div.clock_item before div.clocktwo then it doesn't dissapear but I want div.clocktwo to stay inside div.clock_item.

Thanks for the help!

function loadlink() {
  $('.clocktwo').load('<?php echo get_template_directory_uri(); ?>/melbourne.php', function() {
    $(this).unwrap();
  });
}

loadlink();
setInterval(function() {
  loadlink()
}, 5000);
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="clock_item">


  <svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 310 155" style="enable-background:new 0 0 310 155;" xml:space="preserve">
  <path d="M64.9,44v102.6H36.5V44h-36V19.4h100.5V44H64.9z"/>
  <path d="M105.3,146.7V19.4h28.4v101.9h54.2v25.3H105.3z"/>
  <path d="M281.3,19.4h28.4v127.2h-28.4L220.6,67v79.7h-28.4V19.4h26.6l62.4,81.9V19.4z"/>
  <path d="M0,154.9v-9.1h309.7v9.1H0z"/>
</svg> <!--// MEL LETTERS -->

  <h3>
    MELBOURNE
  </h3>
  
  <div class="clocktwo">

  </div>
</div>

标签： javascriptphphtmlajax

解决方案

我认为这可以解决不要在 div 标签中编写脚本

    <div class="clock_item">


<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
     viewBox="0 0 310 155" style="enable-background:new 0 0 310 155;" xml:space="preserve">
<path d="M64.9,44v102.6H36.5V44h-36V19.4h100.5V44H64.9z"/>
<path d="M105.3,146.7V19.4h28.4v101.9h54.2v25.3H105.3z"/>
<path d="M281.3,19.4h28.4v127.2h-28.4L220.6,67v79.7h-28.4V19.4h26.6l62.4,81.9V19.4z"/>
<path d="M0,154.9v-9.1h309.7v9.1H0z"/>
</svg>   // MEL LETTERS


      <h3>
    MELBOURNE
</h3>



    <div class="clocktwo">

</div>
  </div>
<script>
   function loadlink(){
    $('.clocktwo').load('<?php echo get_template_directory_uri(); ?>/melbourne.php',function () {
         $(this).unwrap();
    });
}

loadlink(); 
setInterval(function(){
    loadlink() 
}, 5000);
    </script>

推荐阅读