MeteorJS 基本 jquery 用法答案

【问题标题】：MeteorJS basic jquery usageMeteorJS 基本 jquery 用法
【发布时间】：2013-01-18 03:17:47
【问题描述】：

在添加了 jquery 包的干净流星应用程序中，我正在尝试使用基本的 jquery css 选择器。我究竟做错了什么？非工作示例可以在这里找到：http://jquery-test.meteor.com/

JavaScript 直接放在生成的template.hello.events 方法下方。

JS：

$("#foo").click( function() {
console.log("clicked!");
});

HTML：

<button id="foo" style="border: 10px">This is a test div</button>

【问题讨论】：

标签： jquery node.js meteor

【解决方案1】：

您必须将 jQuery 代码放在 Template.hello.rendered 函数中。

【讨论】：

所以，为了清楚起见：Meteor 动态生成 html 元素。这意味着我需要将我的 jQuery 代码放在一个确保元素已经被渲染的地方？
是的，在启动时，Meteor 会聚合整个应用程序中的 .html 文件中的所有

【解决方案2】：

正如您提到的，我看到了链接，您的 elems are dynamically generated 并且您正试图将事件放在 dom 中不可用的那些上。因此，您必须将事件委托给 existing closest parent 或 document，这是所有其他元素的 existing parent。

你可以像这样绑定事件：

$(document).on('click', '#foo', function() {
    console.log("clicked!");
});

和make sure to load jQuery first.

【讨论】：

【解决方案3】：

这可能是解决您问题的另一种方法：

HTML：

<button id="foo" class="foo" style="border: 10px">This is a test div</button>

JS：

Template.hello.events({
 'click .foo': function(event){
    console.log('clicked');
    console.log(event.currentTarget);  
  }
});

【讨论】：