web-dev-qa-db-ja.com

progress-barの「aria-valuenow」属性とCSSの「width」プロパティの値を変更するjQuery

ページ（ブートストラップ）に次のような進行状況バーがあります。

<div id="theprogressbar" class="progress-bar progress-bar-u" 
     role="progressbar" aria-valuenow="75%" aria-valuemin="0" 
     aria-valuemax="100" style="width: 75%">

JQueryを介して更新したいのですが、ほとんどの作業を既に完了しており、それに必要な新しい値を計算しましたが、 aria-valuenow およびstyle="width: "値。

私のjQueryがnewprogressという変数として新しい値+％を提供すると仮定します。

$('#theprogressbar'). *(please help me finish this line)* (newprogress)
jqueryprogress-bar
24
Ray_Hack
$('#theprogressbar').attr('aria-valuenow', newprogress).css('width', newprogress);
53
Denis Slonovschi

使用できます

$('#theprogressbar').attr("aria-valuenow","the new value"); 
$('#theprogressbar').attr("style","width:"+theincrementingvalue);

または、jqueryで.cssを使用できます http://api.jquery.com/css/

5
jameshwart lopez

これはより良く機能します：

var newprogress=80;
$('#id').width(newprogress + "%").attr('aria-valuenow', newprogress);
3
Carlo Pescetto

幅を設定するには、jQueryのwidth()メソッドを使用します。

_aria-valuenow_にアクセスするには、attr()を使用します。

両方を組み合わせる：

_$('#id').width(newprogress).attr('aria-valuenow', newprogress);
_
1
Priyank Sheth

この要素の属性は次のように適用できます。

$('#theprogressbar').attr('aria-valuenow',value+'%');   

and 

$('#theprogressbar').attr('width',value+'%');

値が変数にある場合。

$('#theprogressbar').attr('aria-valuenow',newprogressvalue);
0
Umesh Sehta