Question

所以我从wordpress post创建了这些div，它们的数据属性取自php <?php echo $rengdata->format('Y-m'); ?>

<div class="renginiai-box">
     <div class="col-sm-3" data-renginiolaikas="2017-09"></div>
     <div class="col-sm-3" data-renginiolaikas="2017-09"></div>
     <div class="col-sm-3" data-renginiolaikas="2017-09"></div>
     <div class="col-sm-3" data-renginiolaikas="2017-10"></div>
</div>

我现在需要的是创建一个具有唯一日期的单个按钮。结果应该是这样的。

<div class="laikotarpis">
      <button value="2017-09" class="laiko-btn">2017 09</button>
      <button value="2017-10" class="laiko-btn">2017 10</button>
</div>

我不知道什么功能可以适合这个。我应该制作数组还是这个

有一个jQuery函数

Answer 1

您可以使用jQuery迭代数据属性data-renginiolaikas的所有元素并附加一个按钮：

$('[data-renginiolaikas]').each(function(s, e) {
  var val = $(this).attr('data-renginiolaikas');
  if(!$('.laikotarpis button[value=' + val + ']').length) {
  $('.laikotarpis').append('<button value="' + val + '" class="laiko-btn">' + val.replace('-',' ') + '</button>');
  }
});

示例：https://codepen.io/anon/pen/KZQgBw

Answer 2

我认为这更接近：

$('[data-renginiolaikas]').each(function(s, e) {
   if($('.laikotarpis button').val() != $(this).attr('data-renginiolaikas')){
        $('.laikotarpis').append('<button value="' + $(this).attr('data-renginiolaikas') + '" class="laiko-btn">' + $(this).attr('data-renginiolaikas').replace('-',' ') + '</button>');
   }
});

delinear的回答

https://codepen.io/boian-ivanov/pen/MrQjPy

使用div中的数据创建按钮

2 个答案: