jquery - 特定のクラスを持つすべての要素の幅が特定の幅に等しいかどうかを確認することは可能ですか? できればJqueryで

Question

複数の進行状況バーがあるページがありますが、それらはすべて同じクラスです。このクラスのすべての要素の幅が 100% であるかどうかを jquery で確認することは可能ですか? そして、このクラスのすべての要素の幅が 100% のときに jquery 関数を実行しますか?

<div class="progress-bar" style="display: none; width: 100%;"></div>

Answer 1

すべての jquery を使用してループし、 (あなたの場合のように) %<div>で定義されている width 属性を取得しようとしても、その値にパーセンテージでアクセスすることはできません。代わりに、常にの値を返しますpxに含まれていますが、何らかの方法で要素のsの幅の値を取得できた場合は、そこから値を取得できます。そのために、このデモJSFIDDLEを参照できます。<div><div><input type="hidden">

HTML:

<div class="progress-bar" style="display: none; width: 100%;"></div>
<input type="hidden" class="progress-bar-width-val" id="progress_bar_1" value="100">

<div class="progress-bar" style="display: none; width: 95%;"></div>
<input type="hidden" class="progress-bar-width-val" id="progress_bar_2" value="95">

<div class="progress-bar" style="display: none; width: 90%;"></div>
<input type="hidden" class="progress-bar-width-val" id="progress_bar_3" value="90">

<div class="progress-bar" style="display: none; width: 80%;"></div>
<input type="hidden" class="progress-bar-width-val" id="progress_bar_4" value="80">

JS:

$(document).ready(function(){
    $('.progress-bar-width-val').each(function(index) {
        var width = $(this).attr('value');
        alert(width);
    });
});