Question

我有一些JavaScript解析JSON对象，并根据日期值在记录之间插入Date分隔符。类似于Windows文件资源管理器如何显示日期分隔符，如上周，本月早些时候，上个月等等。

我当前的真实项目只是简化了JSON对象，并将每个项目的数据注入到页面HTML中。

我在这个JSFiddle上的测试项目是我比较JSON对象中的Date值和创建不同的Date Diver组的地方。

测试项目http://jsfiddle.net/0vsz8jk4/19/只需打印日期潜水员组及其子项目，并打电话给：

out.innerHTML = JSON.stringify(groups, null, "\t")

这看起来像这样......

我需要帮助，而是将每个项目（包括Date分隔符）传递到另一个JavaScript函数中，该函数将获取JSON数据并使用它创建一些HTML并将其注入页面DOM。

像这样的东西

taskActivitiesContainer.prepend(taskActivityRowHtmlTemplate).fadeIn(2000);

其中taskActivityRowHtmlTemplate是每个JOSN行/记录/项目。它将被传递给一个函数，该函数会在该行/记录中添加一些HTML格式，然后将该行注入DOM。

我有这个小日期实用程序代码来帮助进行日期比较......

// Date library for DateTime comparisons and checking if a date is in-between a range of 2 dates!
var dates = {
  convert: function(d) {
    // Converts the date in d to a date-object. The input can be:
    //   a date object: returned without modification
    //  an array      : Interpreted as [year,month,day]. NOTE: month is 0-11.
    //   a number     : Interpreted as number of milliseconds
    //                  since 1 Jan 1970 (a timestamp)
    //   a string     : Any format supported by the javascript engine, like
    //                  "YYYY/MM/DD", "MM/DD/YYYY", "Jan 31 2009" etc.
    //  an object     : Interpreted as an object with year, month and date
    //                  attributes.  **NOTE** month is 0-11.
    return (
      d.constructor === Date ? d :
      d.constructor === Array ? new Date(d[0], d[1], d[2]) :
      d.constructor === Number ? new Date(d) :
      d.constructor === String ? new Date(d) :
      typeof d === "object" ? new Date(d.year, d.month, d.date) :
      NaN
    );
  },
  compare: function(a, b) {
    // Compare two dates (could be of any type supported by the convert
    // function above) and returns:
    //  -1 : if a < b
    //   0 : if a = b
    //   1 : if a > b
    // NaN : if a or b is an illegal date
    // NOTE: The code inside isFinite does an assignment (=).
    return (
      isFinite(a = this.convert(a).valueOf()) &&
      isFinite(b = this.convert(b).valueOf()) ?
      (a > b) - (a < b) :
      NaN
    );
  },
  inRange: function(d, start, end) {
    // Checks if date in d is between dates in start and end.
    // Returns a boolean or NaN:
    //    true  : if d is between start and end (inclusive)
    //    false : if d is before start or after end
    //    NaN   : if one or more of the dates is illegal.
    // NOTE: The code inside isFinite does an assignment (=).
    return (
      isFinite(d = this.convert(d).valueOf()) &&
      isFinite(start = this.convert(start).valueOf()) &&
      isFinite(end = this.convert(end).valueOf()) ?
      start <= d && d <= end :
      NaN
    );
  },

  // Subtract number of months from current month
  // dates.subtractMonth(1)
  subtractMonth: function(numberOfMonths) {
    //var d = this;
    var d = new Date();
    d.setMonth(d.getMonth() - numberOfMonths);
    d.setDate(1);
    return d;
  }

};

这是我的测试演示代码，用于解析JSON对象并确定日期分隔符应放在JSON项之间的位置......

// JSON records which the date labels will be injected in-between in the HTML that is generated.
var task_activities = [{"id":1,"name":"record 1","date_time":"7\/5\/2015"},{"id":2,"name":"record 2","date_time":"7\/9\/2015"},{"id":3,"name":"record 3","date_time":"7\/13\/2015"},{"id":4,"name":"record 4","date_time":"7\/17\/2015"},{"id":5,"name":"record 5","date_time":"7\/21\/2015"},{"id":6,"name":"record 6","date_time":"7\/25\/2015"},{"id":7,"name":"record 7","date_time":"7\/29\/2015"},{"id":8,"name":"record 8","date_time":"8\/1\/2015"},{"id":9,"name":"record 9","date_time":"8\/5\/2015"},{"id":10,"name":"record 10","date_time":"8\/9\/2015"},{"id":11,"name":"record 11","date_time":"8\/13\/2015"},{"id":12,"name":"record 12","date_time":"8\/17\/2015"},{"id":13,"name":"record 13","date_time":"8\/21\/2015"},{"id":14,"name":"record 14","date_time":"8\/25\/2015"},{"id":15,"name":"record 15","date_time":"8\/29\/2015"},{"id":16,"name":"record 16","date_time":"9\/1\/2015"},{"id":17,"name":"record 17","date_time":"9\/5\/2015"},{"id":18,"name":"record 18","date_time":"9\/9\/2015"},{"id":19,"name":"record 19","date_time":"9\/10\/2015"},{"id":20,"name":"record 20","date_time":"9\/17\/2015"}];


var dateLabels = [];

var groups = {
    'A while Ago': [],
    'Last Month': [],
    'Earliar in the Month': [],
    'Last Week': [],
    'Earlier this Week': [],
    'Yesterday': [],
    'Today': [],
    'other': []
}


dateRangeLabels = {
    'Today': {
        'start': new Date('2015-09-12T00:00:00'),
        'end': new Date('2015-09-12T00:00:00'),
        'dateFunc': 'inRange'
    },    
    'Yesterday': {
        'start': new Date('2015-09-11T00:00:00'),
        'end': new Date('2015-09-11T00:00:00'),
        'dateFunc': 'inRange'
    },    
    'Earlier this Week': {
        'start': new Date('2015-09-06T00:00:00'),
        'end': new Date('2015-09-10T00:00:00'),
        'dateFunc': 'inRange'
    },
    'Last Week': {
        'start': new Date('2015-08-30T00:00:00'),
        'end': new Date('2015-09-05T00:00:00'),
        'dateFunc': 'inRange'
    },
    'A while Ago': {
        'start': new Date('2010-08-30T00:00:00'),
        'end': new Date('2015-07-31T00:00:00'),
        'dateFunc': 'inRange'
    },
    'Last Month': {
        'start': new Date('2015-08-01T00:00:00'),
        'end': new Date('2015-08-31T00:00:00'),
        'dateFunc': 'inRange'
    },
    'Earliar in the Month': {
        'start': new Date('2015-08-30T00:00:00'),
        'end': new Date('2015-09-05T00:00:00'),
        'dateFunc': 'inRange'
    },
    'other': {
        'start': new Date('2015-09-13T00:00:00'),
        'end': new Date('2999-12-31T00:00:00'),
        'dateFunc': 'inRange'
    }
}



// Loop over each Task Activity record and generate HTML
$.each(task_activities, function(i, activity) {
    console.log(activity.date_time);


    for (var key in dateRangeLabels) {
       if (dateRangeLabels.hasOwnProperty(key)) {

            //console.log(key, dateRangeLabels[key]);

           if(dateRangeLabels[key]['dateFunc'] == 'inRange'){

               if(dates.inRange(activity.date_time, dateRangeLabels[key]['start'], dateRangeLabels[key]['end'])){
                   return groups[key].push(activity);
               }

           }else{

               if(dates.compare(activity.date_time, dateRangeLabels[key]['start'])){
                 return groups[key].push(activity);
               }
           }

       }
    }    



}); // end each


//iterate out and print to the screen:
out.innerHTML =JSON.stringify(groups, null, "\t");

摘要

我需要获取我的JSON对象并对其进行解析，检查其中的Date值并在某些记录之间插入Date Divider。

然后我需要以正确的顺序将JSON对象打印到DOM中，同时注入日期分隔符。

我的演示已完成大部分工作http://jsfiddle.net/0vsz8jk4/19/我只需要帮助将最终结果解析为HTML并将每个JSON项注入DOM。

当前演示采用我的JSON对象并迭代每个项目。然后，它会比较每个项目中的日期，以确定它应该在哪个日期分隔符组然后，它会在正确的日期分隔键下的日期分隔符数组上推送该行/项。

我需要迭代新的日期分隔符数组/对象，并能够将日期分隔符注入DOM，然后能够将其所有子项注入到它下面的DOM中。

如果数据分隔符没有任何子项，则不应将该分隔符注入DOM。

我已经构建了一个函数，用于获取传递给它的当前行的JSON数据，它将根据JSON项中的数据生成正确的HTML，并将HTML作为字符串返回，然后将其注入到DOM＆GT;

所以我真的需要帮助迭代这些新数据，以便我可以访问将每个项目/行发送到我的html生成函数。

Answer 1

这个怎么样：

        <property name="jpaVendorAdapter">
            <bean class="org.springframework.orm.jpa.vendor.HibernateJpaVendorAdapter">
                <property name="databasePlatform" value="path.to.dialect.ExtendedDialect" />
            </bean>
        </property>

http://jsfiddle.net/0kuL1gmf/7/

解析JSON对象以将每个项目/行作为HTML

1 个答案: