javascript - 使用原型(prototype)时未处理点击事件(使用 lowpro)

Question

我有 JS 代码，它使用 lowpro(原型(prototype)扩展)来重新排序一组动态生成的问题。因此，当我单击 a.move-up 时，我想将该元素的父元素向上移动。 a.move-down 假设将其向下移动。

我使用的是 lowpro，因为元素是在 dom:loaded 之后生成的。 http://www.danwebb.net/2006/9/3/low-pro-unobtrusive-scripting-for-prototype

JS代码:

document.observe('dom:loaded', function() {
  Event.addBehavior( {
   'a.move-up:click':  function(event) {
        alert('Moving up!')
        //moveUp(this);
        //event.stop();

    },
   'a.move-down:click':  function(event) {
        alert('Moving down!')
        //moveDown(this);
        //event.stop();
    }
  });
});

每个元素 (div.question) 有两个链接，允许该元素向上或向下移动。但是，这些点击事件不会得到处理。

<div id="questions">    
    <div class="question">Q1 stuff 
    <a href="#" class="move-up" />Up</a>
        <a href="#" class="move-down"/>Down</a>
    </div>

    <div class="question">Q2 stuff
    <a href="#" class="move-up" />Up</a>
        <a href="#" class="move-down"/>Down</a>
    </div>
</div>

作为调试的一部分，我已将代码削减到最低限度，只是试图确保事件处理有效。当我点击 JS 支持的链接时，我什至没有看到弹出的警报。因此“click”事件没有得到正确处理。

我做错了什么？？？

谢谢!

Answer 1

经过一些阅读/研究后，我意识到动态生成的元素......

等等...

在 DOM 加载后不会注册/绑定(bind)，因此需要重新加载 addBehavior 才能获取新元素。

因此在动态生成新元素之后，必须调用

 Event.addBehavior.reload();

调用之后，新的动态生成的元素可以像我想要的那样向上/向下移动。

我知道它一定是那么简单和明显的事情......叹息