Question

<!DOCTYPE html>
<!-- Html -->
<html lang="en">
<!-- Head -->
<head>
<title>Coming soon</title>
  <!-- Meta tags -->
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <script type="application/x-javascript"> addEventListener("load", function() { setTimeout(hideURLbar, 0); }, false); function hideURLbar(){ window.scrollTo(0,1); } </script>
  <!-- Meta tags -->
    <link href="css/style.css" rel="stylesheet" type="text/css" media="all" /><!-- stylesheet -->      
    <script type="text/javascript" src="js/jquery-2.1.4.min.js"></script><!-- Supportive-JavaScript -->
 <!--fonts-->
    <link href="//fonts.googleapis.com/css?family=Raleway:100,100i,200,200i,300,300i,400,400i,500,500i,600,600i,700,700i,800,800i,900,900i&subset=latin-ext" rel="stylesheet">
<!--/fonts-->
</head>
<!-- //Head -->
<!-- Body -->
  <body>
  <!-- main-section -->
    <div class="container clock">
        <div class="content">
            <div id="large-header" class="large-header">
                <canvas id="myCanvas"></canvas>
                <div class="main-title">
                    <h1>Temperature Sensor <br /> coming soon</h1>
                    <div class="between"></div>
                    <p class="agileinfo txt-center"> &copy; Janneke 2018</p>
                </div>
            </div>
        </div>
    </div>
    <!-- /main-section -->
  <!-- Counter required files -->
    <link rel='stylesheet' href='css/dscountdown.css' type='text/css' media='all' />
    <script type="text/javascript" src="js/dscountdown.min.js"></script>
    <script src="js/clock.js"></script>
    <script>
        jQuery(document).ready(function($){                     
            $('.between').dsCountDown({
                endDate: new Date("Januari 17, 2018 17:30:00"),
                theme: 'black'
                });                         
        });
    </script>
 <!-- //Counter required files -->
 <!-- particles effect -->
    <script src="js/particles.min.js"></script>
    <script>
      window.onload = function() {
        Particles.init({
          selector: '#myCanvas',
          color: '#6a446b',
          connectParticles: true,
          minDistance: 70
        });
      };
    </script>
<!-- //particles effect -->
</body>
<!-- //Body -->
</html>
<!-- //Html -->

如何在此代码中获得重定向，即使使用setTimeout也尝试了很多来自互联网的解决方案，但是当添加setTimeout时，页面将仅显示文本温度传感器即将推出，但它不再显示时间和日期，该页面有粒子效果，但我需要知道如何在倒计时部分获得重定向。

任何可以让我重新定位到新页面的人

Answer 1

我如何做的一段代码，我希望它会帮助你。

    window.setTimeout(function(){

       // Move to a new location or you can do something else
       window.location.href = "https://www.google.co.in";

    }, 5000);

Answer 2

很简单，你可以使用dsCountdown插件的onFinish选项。

$('.between').dsCountDown({
    endDate: new Date("Januari 17, 2018 17:30:00"),
    theme: 'black',
    onFinish: function() {
        window.location.assign('http://your-page.it');
    }
});

我在dsCountdown库中找到了这个选项（onFinish），这里： https://github.com/iwayanwirka/dscountdown/blob/master/dscountdown.js

Answer 3

我可以收集的是，您在倒计时结束时难以重定向您的网页？

您在倒计时脚本中错过了属性方法onFinish。它是这样的：

onFinish: function(){
    window.location = "https://www.google.com";
}

我已根据您的代码设置了一个示例应用程序，该代码会在1分钟后重定向到Google：https://jsfiddle.net/fatgamer85/a6dhjs2y/1/

希望这有帮助吗？

倒计时后重定向到新页面

3 个答案: