Emberjs + Handlebars + Object onchange 和事件

Posted 2023-02-26

【中文标题】Emberjs + Handlebars + Object onchange 和事件

【英文标题】：Emberjs + Handlebars + Object onchange and events

【发布时间】：2012-02-26 22:50:28

【问题描述】：

我发现 jQuery 观察者没有绑定到把手逻辑中未显示的元素。

假设我有以下内容；

#if person
  Welcome back, <b>person.firstName person.lastName</b>!
else
  Please <a class="login">log in</a>.
/if

<script>
$('.login').click(function() 
    alert("Hi there.");
);
</script>

如果我在控制台中运行，person = null（或任何需要说服那个人是空的） - 登录观察者不起作用。我已经在使用 embers didInsertElement() 来加载其他一些东西，但是有没有我可以挂钩的“onChange”事件，以便我可以重新绑定事件观察者？

【参考方案1】：

最大的问题是为什么你想要那个？ Ember 对点击处理程序具有出色的内置支持，无需通过 jQuery。 <script> 不起作用的原因很可能是 ember 将视图插入 DOM 的延迟方式。当您执行 Ember.View.append() 时，该元素稍后会插入到 DOM 中。

也就是说，这里有一个小提琴，我认为你想要在 didInsertElement() 中附加 jQuery 点击处理程序。

http://jsfiddle.net/algesten/5LPPz/1/

didInsertElement: function () 
    // appending click handler directly with jQuery
    $('.login').click(function() 
        alert("Hi there.");
    );

然而，ember 方法是只使用 click 隐式处理函数：

http://jsfiddle.net/algesten/5LPPz/2/

click: function () 
    alert("Hi there.");

注意后一个处理程序附加到周围的车把div 而不是a，但点击气泡。

【讨论】：

嗨，迈克尔。我认为你没有理解我的问题。我发现事件处理程序仅适用于可见的部分。以我的第一个例子..如果人存在并返回true，我还有一个jQuery观察者，它像这样触发$（'.login）.click（），它加载在didInsertElement（）上。现在 - 通过 webkit 控制台将 person 更改为 false 并尝试单击链接。它不会触发。

【参考方案2】：

您面临的问题是 javascript 只能绑定到 dom 中存在的元素。添加新元素后，它希望您重新绑定这些事件。幸运的是，jQuery 是你的朋友。

<script>
$('body').on('click', '.login', function() 
    alert("Hi there.");
);
</script>

理想情况下，您的选择器是最接近 .login 的父级，不会被 javascript 添加。如果您不确定，以上是安全的选择