Установка атрибута rel динамически

Question

Я использую лайтбокс PrettyPhoto и пытаюсь установить атрибут rel для ссылки, когда другая библиотека javascript, не являющаяся jQuery, делает эту ссылку активной (она устанавливает класс ссылок активным), так что лайтбокс PrettyPhotot открывается. Я не хочу, чтобы ссылка открывалась, если она не является активной. Я успешно установил атрибут, но при нажатии каждая ссылка открывается в лайтбоксе, а не только активная. Нет ошибок в FireBug.

Код Prettyphoto установлен так:

$("a[rel^='prettyPhoto']").prettyPhoto();

Другой код javascripts для активного и неактивного клика:

ContentFlowConf: {
    onclickActiveItem: function (item) {
        $('.active').attr('rel', 'prettyPhoto[gallery]');
    },
    onclickInactiveItem: function (item) {
    $('.active').removeAttr('rel');
        $('.item').click(function(event) {
            event.preventDefault(); 
        });
    }
}

Исходный HTML-код:

 <a class="item" title="Image" href="image.jpg"><img class="content" src="thumb.jpg" alt="Image"/></a>

Другой javascript устанавливает html на:

 <a class="item active" title="Image" href="image.jpg"><img class="content" src="thumb.jpg" alt="Image"/></a>

Я, конечно, новичок и не уверен, что заставит его работать. Я задаюсь вопросом, возможно, нужно использовать функцию .live?

Answer 1

Проблема в том, что когда вы звоните

$("a[rel^='prettyPhoto']").prettyPhoto();

, эти ссылки регистрируются для открытия в prettyPhoto.Изменение атрибута rel позже не влияет на обработчики событий, уже настроенные prettyPhoto.

Я посмотрел документы для prettyPhoto , и кажется, что есть другой способ открытьimage:

$.prettyPhoto.open('image.jpg','Title','Description');

Поэтому, когда пользователь нажимает на ссылку, вы можете проверить, активна ли она, и если да, то вручную открыть prettyPhoto.Примерно так может работать: (не проверено)

$('a.item').click(function() {
  var link = $(this);
  if (link.hasClass('active'))
    $.prettyPhoto.open(this.href, link.text(), '');
});

Answer 2

Решено это следующим образом:

onclickActiveItem : function(){
    initCBox();
},

//lots of code here...

function initCBox(){
    var img1 = $('.item.active').attr('href');
    var label = $('.item.active .content').attr('alt');
    $.prettyPhoto.open(img1, label);
}