使用原型时未处理点击事件（使用lowpro）答案

【问题标题】：Click event not processed when using prototype (with lowpro)使用原型时未处理点击事件（使用lowpro）
【发布时间】：2010-09-17 00:30:18
【问题描述】：

我的 JS 代码使用 lowpro（原型扩展）对一组动态生成的问题进行重新排序。因此，当我单击 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 支持的链接时，我什至看不到警报弹出窗口。所以“点击”事件没有被正确处理。

我做错了什么？？？

谢谢！

【问题讨论】：

我无法重现您的问题，但至少更正<div id=#questions"> 行。您是否在 Javascript 控制台中收到错误消息？
感谢您修复错字。即使我修好了它也不会影响任何事情。我终于找到了原因。请参阅下面的答案。

标签： javascript prototypejs lowpro

【解决方案1】：

在做了一些阅读/研究之后，我意识到动态生成的元素......

等一下……

在 DOM 加载后没有注册/绑定，因此 addBehavior 需要 reload()-ed 才能获取新元素。

所以在动态生成新元素后，必须调用

 Event.addBehavior.reload();

调用之后，可以随意上下移动新的动态生成元素。

我知道它必须像那样简单明了...... 叹息

【讨论】：