1

次のリストアイテムにインクリメントして次のhrefを出力し、その値で画像srcを変更すると、非常に奇妙な問題が発生します。

トレースアウトして次のアイテムに移動し、次の矢印をクリックし続けると増分しますか？以下は私のすべてのコードですので、私が書いたもの以外に問題を引き起こす可能性のあるものは何も正しくありません。

コンセプトはライトボックスと同じです。前の矢印もあります。

HTML：

<div role="main" id="main">
<div id="boxes">
  <ul>
         <li><a href="img/lrgimgs/1.jpg" class="lightbox"><img src="img/thumbs/1.jpg"></a></li>
         <li><a href="img/lrgimgs/2.jpg" class="lightbox"><img src="img/thumbs/2.jpg"></a></li>
         <li><a href="img/lrgimgs/3.jpg" class="lightbox"><img src="img/thumbs/3.jpg"></a></li>
         <li><a href="img/lrgimgs/4.jpg" class="lightbox"><img src="img/thumbs/4.jpg"></a></li>

   </ul>
 </div>
  <div class="nextArrow>next</div>
  <div class="previousArrow>previous</div>
</div>

JQUERY：

 var incrementVar = 0;

 $(".nextArrow").click(function() {
        incrementVar++;
        var hrefa=$('#main').find('#boxes ul li a:eq(' + incrementVar + ')').attr('href');
        $("#thumbnail").attr('src', hrefa); //I am loading the outcome of my hrefa var into another div

 });
4

1 に答える 1

1

これが実用的なフィドルです：http：//jsfiddle.net/Mq3wF/

HTML：

<div role="main" id="main">
<div id="boxes">
  <ul>
         <li><a href="img/lrgimgs/1.jpg" class="lightbox"><img src="img/thumbs/1.jpg"></a></li>
         <li><a href="img/lrgimgs/2.jpg" class="lightbox"><img src="img/thumbs/2.jpg"></a></li>
         <li><a href="img/lrgimgs/3.jpg" class="lightbox"><img src="img/thumbs/3.jpg"></a></li>
         <li><a href="img/lrgimgs/4.jpg" class="lightbox"><img src="img/thumbs/4.jpg"></a></li>

   </ul>
 </div>
  <div class="nextArrow">next</div>
  <div class="previousArrow>previous</div>
</div>​​​​​​

Javascript：

var i = 0;
var hrefa;
$(".nextArrow").click(function() {
     hrefa = $("li").find("a").eq(i).attr("href");
     i++;
    alert(hrefa);
 });​
于 2012-08-02T15:02:48.670 に答える