jQuery Simple SkillBar Обновление значения и графической панели при нажатии - PullRequest
0 голосов
/ 24 сентября 2018

Я использую jQuery Простой SkillBar

<div id="skill1" class="demo" data-width="65" data-background="#FFC107">JavaScript (65%)</div>
<div id="skill2" class="demo" data-width="90" data-background="#FF5722">HTML5+XML (90%)</div>
<div id="skill3" class="demo" data-width="70" data-background="#2196F3">CSS+CSS3 (70%)</div>
<div id="skill4" class="demo" data-width="50" data-background="#F44336">AngularJS (50%)</div>
<div id="skill5" class="demo" data-width="80" data-background="#3B5998">ReactJS + React Native (80%)</div>
$('.demo').simpleSkillbar({});

Как мы видим, полоса будет отображать нагрузку на тело.Теперь у меня есть кнопка с именем #btn для установки значения #skill1 при клике.

$('#btn').on('click', function() {
  $('#skill1').attr("data-width", "20");
});

Однако панель умений не обновляется.Что мне нужно, так это когда я нажимаю кнопку #btn, тогда значение до #skill1 будет обновляться, в том числе и с помощью панели умений.

1 Ответ

0 голосов
/ 24 сентября 2018

Вы не можете обновить панель, как вы сделали, вы должны указать ширину через simpleSkillbar объект плагина.

Это сделает работу

$('#btn').on('click', function() {
  $('#skill1').simpleSkillbar({
  width: 20
  });
});

См. Доказательство: http://jsfiddle.net/9mzLvquw/2/

...