用其他图像每日替换图像(.jpg)的脚本?

时间:2012-11-16 13:55:49

标签: javascript .net visual-studio visual-studio-2005

我有一个Visual Studio 2005网站已经运行了一段时间。我在这个网站上有一个图像(.JPG),我认为我需要应用一些JavaScript或什么?

基本上我在12月份有25张图片,而不是每天进入网站将这张图片更改为另一张图片我希望能够通过代码自动完成此图片。

我有一些.NET技能,但我认为我可能需要使用JavaScript来完成此任务。任何人都可以指出我正确的方向或为我提供一些可能有用的示例代码吗?

2 个答案:

答案 0 :(得分:1)

我认为最简单的方法是将所有图像重命名为“December1.jpg”,“December2.jpg”,“December3.jpg”等。然后,服务器端就可以了:

<img src="/path/to/images/December<%=DateTime.Now.Day%>.jpg"/>

这只会将当月的日期添加到您的图片名称中。有更好的方法可以做到这一点,但对于一次性交易,你不能比这简单得多。

编辑:  您也可以为图像添加“if exists”,这样在26日您就不会得到404图像了。像这样:

更改图片以添加ID并将其默认为隐藏:

<img id="dayImage" runat="server" Visibility="false" src="/path/to/images/December<%=DateTime.Now.Day%>.jpg"/>

然后在后面的代码:

if (File.Exists(@"C:\path\to\images\December" + DateTime.Now.Day + ".jpg"))
{
    //this will show the image if it exists on the disk
    dayImage.Visibility = true;
}

有关详细信息,请访问:http://www.dotnetperls.com/file-exists

答案 1 :(得分:1)

我这样做的方法是使用服务器端代码,但我认为每个人都可以更简单地展示一个JavaScript示例。虽然有几种方法可以用来完成你所要求的,但一种简单的方法是将URL作为数组中的字符串存储到所有图像文件中,如下所示:

var urlPath = new Array();

urlPath[0] = "Leave Empty"; //Because there will never be a 0th day of any month...
urlPath[1] = "/Images/nameOfPic1.jpg";
urlPath[2] = "/Images/nameOfPic2.jpg";
urlPath[3] = "/Images/nameOfPic3.jpg";

然后通过抓住日期来循环:

var myDate = new Date();

然后根据getDate()获取图像的路径:

var currentDate = myDate.getDate();
document.getElementById("imgElement").src=urlPath[currentDate];

然后(取决于您在给定月份的照片数量),您可以根据数字日期指定新照片。当然,使用这个例子,有意义的是,使一定数量的图片等于一个月内的最大天数(31),以便根据需要调用它们。这种方式会在某些月份(少于31天的月份)中遗漏某些图片。如果你想简单地遍历它们,那么完全如上所述,但添加这个而不是最后两个语句(这个例子假设你总是有25张图片):

var currentDate = myDate.getDate();
if(currentDate > 25)
{
    currentDate -= 25;
    document.getElementById("imgElement").src=urlPath[currentDate];
}
else
{
    document.getElementById("imgElement").src=urlPath[currentDate];
}

这并不完全是完美的,因为每个新月的开始都将重新开始图片列表,并且会看到一些图片比其他图片更多。我不确定是否有更好的方法可以做到这一点,但如果您的客户不太挑剔,它应该完成工作。但是,我个人会再次使用服务器端代码并​​设置一个全局的应用程序变量(适用于所有人)并直接处理它并记住AppState变量(很明显我使用WebMatrix(C#)了吗?)无论客户方面的情况如何。

我希望这会有所帮助:)