1

私はあなたが私を助けてくれることを願っています。WordPress のスライダーにプラグインを使用しており、各サムネイルを制御する必要があります。CSS を使用してスタイルを設定できるように、div 内の各子要素に一意の ID を追加したいと考えています。

コードは次のようになります。

<div class="royalControlNavCenterer">
  <a class="current" href="#">1</a>
  <a href="#">2</a>
  <a href="#">3</a>
  <a href="#">4</a>
  <a href="#">5</a>
</div>

ご覧のとおり、現在のクラスはプラグインによって既に追加されています。私が探しているのは、同様に、各要素にクラスを動的に追加して、次のようにすることです。

<div class="royalControlNavCenterer">
  <a id="1" class="current" href="#">1</a>
  <a id="2" href="#">2</a>
  <a id="3" href="#">3</a>
  <a id="4" href="#">4</a>
  <a id="5" href="#">5</a>
</div>

このようにして、デザインに必要な各サムネイルを個別にスタイルできます。これには jQuery が最適なオプションであると考えましたが、どんな提案も受け付けています。

どんな助けでも大歓迎です！

4

3 に答える 3

5 
$(".royalControlNavCenterer > a").prop( "id", function( i ) {
    return i + 1;
});

0 ベースのインデックス作成が問題ない場合、IE:

<div class="royalControlNavCenterer">
  <a class="current" href="#" id="0">1</a>
  <a href="#" id="1">2</a>
  <a href="#" id="2">3</a>
  <a href="#" id="3">4</a>
  <a href="#" id="4">5</a>
</div>

あなたは逃げることができます

$(".royalControlNavCenterer > a").prop("id",​ Number);​
于 2012-07-13T15:22:52.377 に答える
1

これは機能するはずです... の直接aの子を対象とし、1 から始まる属性royalControlNavCentererを与えます。id

$(".royalControlNavCenterer > a").each(function(i) {
   $(this).attr("id", i+1);
});
于 2012-07-13T15:22:49.533 に答える
1

の最後にこれを追加することでそれを行うことができbodyます：

<script type="text/javascript">
$(window).load(function(){
    var globalCount = 0;   
    $('.royalControlNavCenterer a').each(function(){
       this.id='id_'+(globalCount++);
    });
});
</script>

しかし、動的 ​​ID を指定する意味がよくわかりません。個別のスタイルを指定するためにこれを行う必要はありません。

デモンストレーション: http://jsfiddle.net/dystroy/LrBxc/ (F12 を入力してコンソールを表示)

提案された ID がHTML 4 標準に従っていないという事実に悩まされたのは私だけだったようです。

ID および NAME トークンは文字 ([A-Za-z]) で始まる必要があり、その後に任意の数の文字、数字 ([0-9])、ハイフン ("-")、アンダースコア ("_") を続けることができます、コロン (":")、およびピリオド (".")。

于 2012-07-13T15:22:58.127 に答える