Почему изменение текста в Рафаэле отменяет события? - PullRequest
Новая
       3

Почему изменение текста в Рафаэле отменяет события?

0 голосов
/ 27 марта 2012

У меня есть текстовый элемент Raphael с обработчиком события mouseup и click. Если я изменю текст в обработчике события mouseup, обработчик события click больше не будет вызываться. Почему это происходит?

Я тестировал следующий код в Chrome, Firefox и Opera: 

<!doctype html>
<html>
<head>
  <script type='text/javascript' src='jquery-1.7.1.js'></script>
  <script type='text/javascript' src='raphael-min.js'></script>
  <script type='text/javascript'>
window.onload = function() {
  var paper = Raphael(document.getElementById('raphael'),500,200);
  var text1 = paper.text(100, 20, "Just movin'");
  var text2 = paper.text(100, 40, "Hello World");

  $(text1.node).mouseup(function() {
    text1.attr({"x" : "200"});
    console.log("text1 mouseup");
  });
  $(text1.node).click(function() { 
    console.log("text1 click"); // Is called
  });

  $(text2.node).mouseup(function() {
    text2.attr({"text": "Goodbye world"});
    console.log("text2 mouseup");
  });
  $(text2.node).click(function() { 
    console.log("text2 click"); // Is not called
  });
}
  </script>
</head>
<body>
<div id="raphael"></div>
</body>
</html>

1 Ответ

1 голос
/ 28 марта 2012

Делая так, вы удаляете dom text2.node и заменяете новым dom, который присоединяется только с событием щелчка.

Так попробуйте сделать это следующим образом 

 $(text2.node).mouseup(function(event) {
    // event.target is tspan
    // event.target.childNodes[0] is TextNode
    event.target.childNodes[0].nodeValue = "BYE WORLD";
    console.log("text2 mouseup", this);
  });

Iпроверил это работало нормально.

...