0

我正在使用 SPServices 从 SharePoint 列表中提取数据。列表中的每一行都将插入到容器 div 中，其类对应于列表中的月份和年份数据，如下所示：

<div class="container">
  <div class="child 07-2013">
    <p>Some content</p>
  </div>
  <div class="child 06-2013">
    <p>Some content</p>
  </div>
  <div class="child 06-2013">
    <p>Some content</p>
  </div>
  <div class="child 11-2012">
    <p>Some content</p>
  </div>
  <div class="child 11-2012">
    <p>Some content</p>
  </div>
</div>

我需要编写一个脚本（最好是 jQuery，而不是我更熟悉的正确的 JavaScript），它将找到每个类的第一个并在它之前添加另一个 div，这样它最终会像这样：

<div class="container">
  <div class="header">July 2013</div>
  <div class="child 07-2013">
    <p>Some content</p>
  </div>
  <div class="header">June 2013</div>
  <div class="child 06-2013">
    <p>Some content</p>
  </div>
  <div class="child 06-2013">
    <p>Some content</p>
  </div>
  <div class="header">November 2012</div>
  <div class="child 11-2012">
    <p>Some content</p>
  </div>
  <div class="child 11-2012">
    <p>Some content</p>
  </div>
</div>

我知道我可以写这样的东西：

function addHeaders(){
  $('.07-2013').before('<div class="header">July 2013</div>');
  $('.06-2013').before('<div class="header">June 2013</div>');
  etc...
}

但问题是我不想在脚本中定义每个类，因为数据会不断添加到 SharePoint 列表中，我想对其进行验证，以便作者可以更新 SharePoint 列表并且脚本将处理数据自动。

那么，有什么方法可以模糊地找到容器 div 中每个类的第一个实例？

4

2 回答 2

5

尝试

var months = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'], flag = {}
$('.container > .child').each(function () {
    var month = this.className.match(/(\d{2})-(\d{4})/);
    if(flag[month[0]]){
        return;
    }
    flag[month[0]] = true;
    $(this).before('<div class="header">' + months[month[1] - 1] + ' ' + month[2] + '</div>')
})

演示：小提琴

于 2013-09-18T09:33:37.440 回答
0

与其在函数中使用 $('.07-2013') ，不如参考我在所有 div 中找到的 $(".child") 。

并且与要在该 div 中使用的文本相关，您可以编写一个脚本来返回与该数字相对应的月份名称，并将其按年份附加到该 DIV 中。

于 2013-09-18T09:31:06.313 回答