1

それぞれ 3 つのクラス名を持つ div 要素がいくつかあります。それぞれの中にイメージがあります。それらは、クラス名を通じて連続番号 ( i1, i2, i3...) が付けられます。クラス名は のようなもの"img small i14"です。要素ごとにこれらのクラス名の数を増やす必要があります。

したがって、これらの div 要素ごとに、iで始まるクラスを変更する必要があります- 1 を追加するか、そこから 1 を減算します。うまくいけば、これを行う効率的な方法があります。

全体の目標は、回転する画像ギャラリーを作成することです。コードを手伝ったり、問題にアプローチするより良い方法を提供したりして、助けていただければ幸いです。ありがとうございました。

4

2 に答える 2

2

これを簡単にするjQueryツールはないと思います。プレーンな JavaScript でそれを行うだけです。

function updateIndex( className ) {
  return className.replace(/\bi(\d+)\b/, function(_, n) {
    return 'i' + ((+n) + 1);
  });
}

次に、要素の「className」プロパティをそれに渡し、「className」を戻り値に更新します。

element.className = updateIndex( element.className );
于 2012-09-23T15:04:21.643 に答える
0

PointyのregExpをundefinedのjQuery属性セッターと組み合わせると、次のようになります。

$(a selector).attr('class', function (index, attrValue) {
    return attrValue.replace(/\bi(\d+)\b/, function (match, $1) { 
        return 'i' + (Number($1) + 1);
    });
});

クラスはhtml属性であるため、これは正常に機能します（ブラウザー間で）。

編集：それが最後の画像であるかどうかを確認するには、そのコンテナにある画像の数を知る必要があるため、コンテナの1つにある画像とちょうど一致するjqueryセレクターが必要です。コードは次のようになります。

var number_of_elements = $(the selector).length;

$(the selector).attr('class', function (index, attrValue) {
    return attrValue.replace(/\bi(\d+)\b/, function (match, $1) { 
        var number = Number($1);
        if (number === number_of_elements) {
            return 1
        } else {
            return 'i' + (number + 1);
        }
    });
});
于 2012-09-23T16:29:04.297 に答える