Question

我的页面上有一个javascript小部件，可以输出Sunrise和Sunset的时间。以下代码是输出的内容（假设这些时间每天都在变化）。我对小部件的输出有无控制。

<div id="sun_container">
    <div class="details">
        Sunrise: <strong>7:00AM</strong> |
        Sunset: <strong>4:30PM</strong>
    </div>
</div>

在我的页面上的其他地方，我有一个如下所示的图像标记：

<div id="sun_button">
    <img src="images/day.png">
</div>

我想解析日出时间和日落时间，并将它们与当前服务器时间进行比较（如果需要，我可以通过PHP输出）。

如果当前服务器时间不是在日出和日落时间之间，那么我想将图片src更改为"images/night.png"。

关于如何做到这一点的任何想法？

编辑：我现在正在使用以下网址<head>输出服务器时间：

var server_time = "<?=date("H:i:s", time())?>";

输出如下内容：

var server_time = "17:07:41";

Answer 1

您可以使用DateJS JavaScript library：

轻松完成

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
<script type="text/javascript" src="http://www.datejs.com/build/date.js"></script>
<script type="text/javascript">
$(document).ready(function(){
 var sunrise = Date.parse($(".details strong:eq(0)").text());
 var sunset = Date.parse($(".details strong:eq(1)").text());
    if(Date.parse("" + server_time).between(sunrise, sunset)) { 
       $("img").attr("src","images/day.png")
    }
    else {
       $("img").attr("src","images/night.png")
    }
});
</script>

Try it here!

Answer 2

我认为你正在寻找这篇文章：What is the best way to parse a time into a Date object from user input in Javascript?

同样的前提，它是javascript，但这似乎是最好的解决方案。

修改另外，请参阅@Ender关于如何检索数据的解决方案。

Answer 3

嗯，您可以通过执行以下操作来获取日出/日落时间：

var sunrise = $('#sun_container .details strong:eq(0)').text();
var sunset = $('#sun_container .details strong:eq(1)').text();

从那里可能将服务器时间写入JS var，进行比较，然后：

if (isNight) {
    $('#sun_button img').attr('src', 'images/night.png');
}

这应该让你开始。

Answer 4

假设您可以在24小时内生成这样的容器：

<div id="server_time">18:00</div>
<script>
$(function() {
// Assume server_time is 24hr
var server = new Date(Date.parse("2000-01-01 " + $('#server_time').text()));
var sunrise = $('#sun_container .details strong:eq(0)').first().text();
var sunset = $('#sun_container .details strong:eq(1)').last().text();

// strip off AM/PM
sunrise = sunrise.substring(0, sunrise.length-2);
sunset = sunset.substring(0, sunset.length-2);

// Parse to standard dates
sunrise = new Date(Date.parse("2000-01-01 " + sunrise)) ;
sunset = new Date(Date.parse("2000-01-01 " + sunset));
// Add tweleve hours to compensate for PM
sunset.setHours(sunset.getHours() + 12);

if (server < sunrise || server > sunset)
    $('#sun_button > img').attr('src', 'images/night');
});
</script>

使用jQuery从HTML解析时间数据

4 个答案: