0

ページ上のすべての要素を特定のクラスでループしてから、スタイルの色を動的に設定しようとしています。問題は、常に最後のオブジェクトの色属性を使用していることです。色をログに記録すると、常に異なるため、理由がわかりません。これが私のコードです：

var find= $("."+id);
find.each(function(index, element) {
    var colour = $(this).attr('colour');

    var top = $("."+id + ".top");
    var mid = $("."+id + ".middle");
    var bot = $("."+id + ".bottom");
    top.attr("style","border-bottom: 27px solid "+colour);

    mid.attr("style","background:"+colour);

    bot.attr("style","border-top: 27px solid "+colour);

});

誰が私が間違っているのか考えていますか? どうもありがとう！

編集：HTMLは次のとおりです。

<div class="hex-row">
 <a href="">
  <div class="hex ">
   <div class="top image" colour="#E1BB4E"></div>
   <div class="middle image" colour="#E1BB4E"></div>
   <div class="bottom image" colour="#E1BB4E"></div>
 </div>
</a>
<a href="">
 <div class="hex ">
  <div class="top publishing" colour="#A34F70"></div>
  <div class="middle publishing" colour="#A34F70"></div>
  <div class="bottom publishing" colour="#A34F70"></div>
</div>
</a>
</div>

問題はdivを見つけることではありません-コードは正しい要素をターゲットにしています-しかし、それらをすべて同じ色に設定しています。各要素 attr('colour') を取得してその色を使用することになっています。

4

1 に答える 1

0

これは、「id」変数を変更していないために発生しているようです。したがって、繰り返しごとに同じ要素に新しい色を設定し、最後に「find」変数の最後の要素の「color」属性に等しい色を設定します。

于 2013-05-25T12:35:36.330 に答える