html - mootools 使用功能加载内容

Question

我正在使用 mootools，我想加载一个 div （命名response）内容。我在 javascript 中传递的 div 内容，$('response').set('html', content)其中内容是可变的。在内容变量中，我有一些带有按钮的 html 代码，并且想要创建一个事件句柄（单击）。

我使用 json 请求加载并传递给元素的内容：

<div id="undo">
  <ul>
    <li> <button value="1">foo</button> </li>
    <li> <button value="2">bar</button> </li>
  </ul>
</div>

我的 javascript 看起来像

$('undo').addEvents({
    'click:relay(button)': function(ev, element){
         alert('a button clicked!');
    }
});

但我不知道为什么这个活动没有奏效。

我认为问题是$('undo')当 dom 对象准备好时不存在但我不知道如何解决这个问题。

Answer 1

将 dom 树进一步委托给在 domready 块运行时存在的元素。例如，如果你有<div id=content>... </div>（或者response如果它是静态的）

document.id('content').addEvents({
    'click:relay(#undo button)': function(event, element){
        event.stop();
        console.log(element.get('value'));
    }
});

鉴于您稍后将数据注入那里，这将正常工作。