我正在使用 Meteor 开发一个网站。我刚刚开始使用 Controller ,但不知道如何单击按钮。
我有以下模板:
<template name="login">
<form>
<input type="email" name="loginEmail">
<input type="password" name="loginPassword">
<input type="submit" class="login" value="Login">
</form>
</template>
还有我的 Controller :
LoginController = RouteController.extend({
template: 'login',
'click .login': function(e, t) {
alert('submit button is clicked');
}
});
现在,当我单击提交按钮时,页面会重新加载并将所有数据传递到 URL。这根本不是我想要的。我希望弹出警报。
我不太知道从哪里开始,我认为这与我不明白应该如何使用 Controller 有关。在使用 Controller 之前,这是有效的:
Template.login.events({
'submit form': function(event){
event.preventDefault();
var emailVar = event.target.loginEmail.value;
var passwordVar = event.target.loginPassword.value;
Meteor.loginWithPassword(emailVar, passwordVar);
console.log('loggin in');
}
});
那么我怎样才能在我的 Controller 中实现同样的事情呢?或者我应该为此制定一个方法?
注意:我使用iron:router 来调用 Controller :
Router.route('/login', {
name: 'login',
controller: 'LoginController'
});
最佳答案
您的问题来自于“提交”类型的 input
将提交表单,这将触发页面重新加载,因为表单的默认目标是相同的 URL。
因此,您必须阻止按钮的默认行为以避免表单提交,如下所示:
'click .login': function(e, t) {
e.preventDefault();
alert('submit button is clicked');
}
此外,您无法在RouteController
中获取模板事件,您必须坚持使用Template.login.events
,就像您实际所做的那样。但是,您可以将事件从提交表单
更改为click .login
,如下所示:
Template.login.events({
'submit form': function(event){
event.preventDefault();
var emailVar = event.target.loginEmail.value;
var passwordVar = event.target.loginPassword.value;
Meteor.loginWithPassword(emailVar, passwordVar);
console.log('loggin in');
}
//OR
'click .login': function (event) {
event.preventDefault();
//your logic here
}
});
关于javascript - 铁中的 meteor 获取事件 :router controller,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37434617/