0

伙计们,我为此发疯了,我知道使用 javascript 有很多限制,但我正在构建的网站只有 html 文件。我也可以使用 php,但它需要是一个可以引用但不包含在内的单独文件。最终扩展名必须是 .html

也就是说,我正在制作一张当天脚本的照片,以获取包含日期的图像名称的图像目录。例如,今天的图像是20120822.jpg,并且有一个巨大的图像目录,直到年底。明天的图片是20120823.jpg,昨天是20120821.jpg

好的,那部分有点简单.. 但现在我想创建一个由以前显示的所有图像组成的画廊.. 所以每个图像都会导致当前日期的文件名。所以我需要读取目录或只生成导致当前图像日期文件名的最后 20 张图像。我会满足于前 20 张图片或其他内容。

这是我用于当天照片的代码..知道我会怎么做吗?

    <script>


     //returns the current date in YYYYMMDDf_01.jpg format
     function getCurrentDateString(){

       //make a new date object set at the current date
       var currentDate = new Date();

       //get the four position year and
       //make it a string
       var currentYear = currentDate.getFullYear() + "";

       //get the zero-indexed month and add 1
       //for the real month and make it a strintg
       var currentMonth = (currentDate.getMonth() + 1) + "";

       //add a zero at the beginning if only one
       //digit month
       if (currentMonth.length == 1) {
         currentMonth = "0" + currentMonth;
       }

       //get the current day of the month and
       //make it a string
       var currentDayOfMonth = currentDate.getDate() + "";

       //add a zero if necessary
       if (currentDayOfMonth.length == 1) {
         currentDayOfMonth = "0" + currentDayOfMonth;
       }

       return(currentYear + currentMonth + currentDayOfMonth);
     }

     //preload image based upon currentDate
     var currentDateString = getCurrentDateString();

     var dailyImageObject = new Image();

      var dailyImageObjectURL = new Image();

     dailyImageObject.src = "http://perillotours.com/galleries/photo-of-the-day/images/" +         currentDateString + ".jpg";

     dailyImageObjectURL.href = "http://perillotours.com/galleries/photo-of-the-day/images/" + currentDateString + ".jpg";

     //called when the page loads to
     //set the actual HTML IMG element to have the same
     //SRC as our cached Image object
     function showDailyImage(){
       document.getElementById("dailyIMGElement").src = dailyImageObject.src;
     }
      function showDailyImageURL(){
       document.getElementById("dailyIMGElementURL").href = dailyImageObjectURL.href;
     }

     </script>

这是我放置在 html 页面中以显示当天照片的代码。

    <a rel="prettyphoto" id="dailyIMGElementURL">
    <img width="523" style="background-color: #000000;" id="dailyIMGElement" height="335" border="0" /></a> 

所以基本上我想用最后 20 张图像循环上面的代码 20 次。任何想法我真的想不出该怎么做..

非常感谢您提供任何帮助或想法!

伊恩

4

1 回答 1

0

您的代码没有引用任何 jQuery,因此假设您希望使用 jQuery:

  1. 从循环开始 - 这样您就可以轻松定义所需的图像数量。通过使用日期对象,您不必担心减去多少天。(工作示例:http: //jsfiddle.net/qH8xX/2/

    var html = "";
    for( i = 0; i < 20; i++ ) {
        html += "<li>" + i + "</li>";
    }
    
    $("#gallery").html( html );
    
  2. 在循环中,从日期中减去 1,然后将其保存为日期。(工作示例:http: //jsfiddle.net/qH8xX/3/

    var html = "";
    var date = new Date(); // store the current date
    
    for( i = 0; i < 20; i++ ) {
        // subtract 1 from date
        // more here: http://stackoverflow.com/questions/1187824/finding-date-by-subtracting-x-number-of-days-from-a-particular-date-in-javascrip
        date = new Date( date.setDate( date.getDate() - 1 ) );
        html += "<li>" + i + " = " + date.toDateString() + "</li>";
    }
    
    $("#gallery").html( html );
    

3. 轮到你了:现在使用日期对象创建具有正确文件名的图像标签。使用它会有所帮助:http ://www.w3schools.com/jsref/jsref_obj_date.asp

于 2012-08-22T16:02:34.057 回答