Как получить доступ к атрибуту id любого элемента в Raphael

Я использую Raphael для рисования некоторых элементов на веб-сайте. К элементам относятся прямоугольник, линия (путь). Я дал идентификатор элементу пути и пытаюсь получить к нему доступ в событии onclick этой строки. но когда я делаю оповещение об идентификаторе, ничего не видно. Ниже приведен фрагмент кода

function createLine() 
{ 
  var t = paper.path("M" + xLink + " " + yLink +"L" + linkWidth + " " + linkHeight);
  t.attr('stroke-width','3');
  t.attr('id','Hello');
  t.node.onclick = processPathOnClick; 
}

function processPathOnClick() 
{
    alert($(this).attr("id"));
}

Может ли кто-нибудь сказать мне, в чем проблема с приведенным выше кодом. Любой указатель будет полезен.

Спасибо


person sgbharadwaj    schedule 15.12.2010    source источник


Ответы (3)


Вы уверены, что не хотите вместо этого писать $(t.node).attr('id','Hello');?

Обновление: кто-то только что проголосовал за этот ответ. И я действительно чувствую себя обязанным указать, что этот способ установки идентификатора не особенно хорош. Вам лучше использовать:

t.node.id = 'Hello';

Хотелось бы, чтобы был способ отдать должное Хуану Мендесу, кроме как проголосовать за его комментарий к этому ответу.

person Zecc    schedule 15.12.2010
comment
Это должно работать, но я сбит с толку тем, почему люди используют jquery для установки идентификатора узла, много шума. Сравните это с t.node.id = 'Hello' - person Juan Mendes; 16.12.2010
comment
@sgbharadwaj Ха, я только что попробовал, и у меня сработало. Вы тогда переписали на $(this.node).attr('id') в обработчике? В любом случае, как уже было сказано, вы можете просто написать t.node.it = "Hello" и alert(this.id) в обработчике- - person Zecc; 16.12.2010
comment
Согласно комментарию Дмитрия Барановского (создателя Raphael) в этом сообщении stackoverflow. com/questions/3613636/using-jquery-with-raphael никогда не должен быть доступен, но что еще мы могли бы тогда использовать? У меня возникла проблема с попыткой использовать несколько форм Рафаэля и манипулировать ими с помощью Jquery. - person XaolingBao; 23.10.2014

Попробуй это:

function createLine()  { 
    var t = paper.path("M" + xLink + " " + yLink +"L" + linkWidth + " " + linkHeight);
    t.attr('stroke-width','3');
    t.id = 'Hello';
    t.node.onclick = processPathOnClick;
}

function processPathOnClick() {
    alert($(this).id);
    alert(this.id); // This should work too...
}

По сути, вы создаете новое свойство под названием «id» в переменной экземпляра строки Raphael «t». На мой взгляд, это своего рода взлом, но он отлично справляется со своей задачей.

person Guillaume Gervais    schedule 31.03.2011

Попробуйте установить обработчик с помощью jquery

function createLine() 
{ 
  var t = paper.path("M" + xLink + " " + yLink +"L" + linkWidth + " " + linkHeight);
  t.attr('stroke-width','3');
  t.attr('id','Hello');
  $(t.node).click(processPathOnClick);
}

function processPathOnClick() 
{
    alert($(this).attr("id"));
}
person Juan Mendes    schedule 15.12.2010
comment
Привет, Хуан, установка обработчика не сработала. Я изменил атрибут настройки на t.node.setAttribute('id',pathId); и доступ к нему для оповещения($(this).attr('id')); это сработало - person sgbharadwaj; 16.12.2010
comment
Что ж, тогда это говорит вам о том, что установка идентификатора на объекте Raphael не устанавливает его на узле. Не нужно использовать jquery для установки идентификатора. Ваш код был бы намного проще, если бы вы делали t.node.id='my-id', а ваш обработчик мог бы просто использовать alert(this.id) - person Juan Mendes; 16.12.2010