2012-11-16 47 views
1

我有一个运行了一段时间的Visual Studio 2005网站。我在这个网站上有一个图像(.JPG),我想我需要应用一些JavaScript或其他东西?脚本每天用另一个图像替换图像(.jpg)?

本质上,我有十二月份的25个图像,而不是每天进入该网站将该图像更改为另一个,我希望能够通过代码自动完成此。

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

+0

你可以把每一个.JPG像1.JPG,2.JPG,3.JPG等..然后使用JavaScript来确定该月的一天,致电JPG像那样。是的,Javascript是要走的路。 http://stackoverflow.com/questions/2920129/can-i-run-javascript-before-the-whole-page-is-loaded和http://stackoverflow.com/questions/11722400/javascript-change-img- src应该有所帮助。 –

+0

其实,我不会使用JavaScript - 这是更适合服务器处理的东西。 – rlemon

+0

@BlaiseSwanwick非常感谢这两个环节,他们有很大的帮助。 –

回答

1

我认为最简单的方法可能是将所有图像重命名为像“December1.jpg”,“December2.jpg”,“December3.jpg”等,然后服务器端你会有这样的:

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

这只会将一个月的一天添加到您的图像名称。有更奇特的方式来做到这一点,但对于一次性交易,你不能比这更简单。

编辑: 您可能还会为图片添加“if exists”,以便在26日您不会收到404图片。事情是这样的:在后面的代码然后

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

改变你的形象加一个ID和默认它隐藏

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

+0

非常感谢这个,我会在我的开发网站上发布这个。 –

+0

我添加了另一个想法,您可能会添加到您的代码,以防止404图像 – davehale23

1

我会这样做的方式是使用服务器端代码,但我认为每个人都可以更简单地展示JavaScript示例。虽然有多种方法之一可能采取的完成你的要求,一个简单的方法来做到这一点是将网址存储所有图像文件作为一个字符串数组,因为这样的:

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"; 

基于关GETDATE()的

var myDate = new Date(); 

然后得到的图像的路径:通过他们然后循环通过抓取日期

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#)呢?)不管客户端情况如何。

我希望这有助于:)