从我页面上的span更新饼图的值

Question

我正在使用饼图脚本，我正在尝试从我的页面上的span更新值。

饼图看起来像这样：

HTML

<ul>
  <li><span class="newValue">25</span></li>
  <li>
    <div class='pieCharts'>
      <div class='chart'>
        <div class='percentage' data-percent='100'>
          <span>0</span><sup>%</sup>
        </div>
      </div>
    </div>
  </li>
</ul>

jQuery的

$('.percentage').easyPieChart({
  animate: 1000,
  lineWidth: 8,
  barColor: '#00aeef',
  scaleColor: 'transparent',
  onStep: function(value) {
    this.$el.find('span').text(Math.round(value));
  },
  onStop: function(value, to) {
    this.$el.find('span').text(Math.round(to));
  }
});

这是我尝试更新数据百分比值的方式，但它不起作用：

$('.percentage').attr('data-percent', $(this).closest('.newValue').html());

JSFiddle有充分的工作实例

Answer 1

$(this).closest('.newValue').html()正在评估undefined，这导致饼图不更新。只需将值更改为$('.newValue').html()即可更新图表。

Answer 2

使用data

$('.percentage').data("percent", $('.newValue').html());

jsfiddle

要么

$('.percentage').attr('data-percent', $('.newValue').html());

jsfiddle