0

有一个从数据库中读取数据的画廊。

在其下方有一些圆圈显示所有数据或记录的数量。

每次一个圆圈变成黄色，表示什么是活动帖子。

我已经通过这种方式生成了这种机制：

function drawCircles(activeIndex) {
    var off_html = '<img class="post_circle" src="../themes/dark/images/off.png"/>';
    var on_html = '<img class="post_circle" src="../themes/dark/images/on.png"  />';
    $('#circles').empty();

    for (var i = 1; i <= pcount; i++) {

        if (i != activeIndex) {
            $(off_html).appendTo($('#circles'));
        }
        else {
            $(on_html).appendTo($('#circles'));
        }

    }


}

PCount = 所有帖子的计数...

#circles div 是一个包含圆圈的条形图。**

当我们打电话时

drawCircles(2)

第二个圆圈变成黄色。现在我想为此创建一个点击事件。我想了解点击了哪个圆圈？我试过.live function ，但我找不到点击了哪个圆圈...

4

1 回答 1

1

尝试：

$('#circles img.post_circle').on('click', function(e) {
  // e.target is the circle clicked
});

编辑：这是一个更完整的答案：

$(function(){
  var off_html = '<img class="post_circle" src="http://placehold.it/50x50/ff0000"/>';
  var on_html = '<img class="post_circle" src="http://placehold.it/50x50/ffff00"/>';

  var pcount = 5;

  $('#circles').empty();    
  drawCircles(3);

  function drawCircles(activeIndex) {
    for (var i = 1; i <= pcount; i++) {
      if (i != activeIndex) {
        $(off_html).data('index', i).appendTo($('#circles'));
      } else {
        $(on_html).data('index', i).appendTo($('#circles'));
      }
    }
  }

  $('#circles img.post_circle').on('click', function(e) {
    alert($(this).data('index'));
  });
});

这是一个小提琴

于 2012-10-06T14:06:43.857 回答