如何在使用blaze呈现的新模板上实例化事件侦听器?

时间:2015-06-10 06:50:03

标签: javascript meteor

我有一个由Blaze呈现的模板,因为我有一个创建的目标网页,然后在用户点击注册按钮时将其删除,然后将其带到Blaze呈现的另一个模板。

HTML非常空白,只有模板的div

<head>
  <title>Perform</title>
</head>

<body>
<div id="template">
</div>

</body>

这是一个加载的虚拟第一个模板。

<template name="first">
    <button id="first_button">Click to jump to the next template</button>
</template>

加载的第二个(虚拟)模板

<template name="second">
    <button id="second_button">This button is not wired to an event</button>
</template>

我将所有Javascript加载到客户端上运行的一个文件中:

var currentView;
var templateContainer;
$(document).ready(function() {

    templateContainer = document.getElementById('template');

    // This renders the first template. All events are currently working
    currentView = Blaze.render(Template.first, templateContainer);
});

Template.first.onDestroyed(function() {
    // This console.log is firing
    console.log("Destroyed first template");
});

Template.first.events({
    'click #first_button': function () {
    // Remove the first template with Blaze
    Blaze.remove(currentView);

    // Render the second template
    currentView = Blaze.render(Template.second, templateContainer);
    }
});


Template.second.onCreated(function() {
    // This console.log is firing when the 'second' template is created
    console.log("Hello! I've been created");
});
// The second template is actually a form I'd like to submit. Form omitted for brevity
Template.second.events({
    'submit #second_button': function(e, t) {
        // This console log is not firing.
        console.log("Register clicked");

    }
});

任何人都知道我需要做些什么来获得第二个&#39;解雇模板的事件?它只是没有工作,现在有点令人沮丧。

提前感谢您的帮助。

1 个答案:

答案 0 :(得分:0)

好吧,我是一个完全白痴,最后我自己搞清楚了。

第二个模板上的click事件实际上在测试和调试后有效,但是,提交事件将不起作用。这是两个完全不同的东西,我只是一个不明白这个的白痴。为那些早先看过这个并且感到困惑的人们道歉。

而不是:

Template.second.events({
'submit #second_button': function(e, t) {
    // This console log is not firing.
    console.log("Register clicked");
    }
});

我把它改为:

Template.second.events({
'submit #second_button': function(e, t) {
    // This console log is now firing
    console.log("Register clicked");
    e.preventDefault()
    return false;

    }
});