2

私は jQuery UI プログレス バーを持っており、何か Extra を追加したいと考えています。私はjQueryやjavascriptsが得意ではないので、これが可能かどうかはわかりません。

ここに私が現在持っているもの( js fiddle ): http://jsfiddle.net/saifrahu28/WH2dt/

私が望んでいること： 「 + 」をクリックすると、値が増加し、プログレスバーも増加します。現在、プログレス バーの値も「 50% 」になっています。+ をクリックすると値とプログレス バーが増加し、[-] をクリックすると値とプログレス バーが減少します。

これの解決策があれば、それは私にとって大きな助けになります。

HTML 

<div id="progressbar"></div>

  <p>+</p>
  <p>-</p>

  <p>50%</p>

js

$(function() {
$( "#progressbar" ).progressbar({
  value: 50
 });
});
4

5 に答える 5

0

プログレスバーの値を設定する+およびボタンにいくつかのクリックハンドラーをアタッチする必要があります。-これを試して：

$("#progressbar").progressbar({
    value: 50
});

var setProgressBarValue = function(dir) {
    var step = 5;
    var multi = $(this).hasClass('inc') ? 1 : -1
    $('#progressbar').progressbar('value', $('#progressbar').progressbar('value') + (step * multi));
}

$('.inc, .dec').click(setProgressBarValue);

更新されたフィドル

于 2013-08-19T12:20:27.363 に答える
0

これは、このフィデルhttp://jsfiddle.net/XR9Vj/に示されているように、やりたいことの作業コードです

HTML

<div id="progressbar"></div>
<p class="increase">+</p>
<p class="decrease">-</p>
<p class="value">50%</p>

Javascript

$(function () {
    progressValue = 50;
    $("#progressbar").progressbar({
        value: progressValue
    });
    $('.increase').on('click', function () {
        $("#progressbar").progressbar('value', progressValue++);
        $('.value').text(progressValue + "%");
    });
    $('.decrease').on('click', function () {
        $("#progressbar").progressbar('value', progressValue--);
        $('.value').text(progressValue + "%");
    });
});

それが役に立てば幸い、

R.

于 2013-08-19T12:22:53.183 に答える