假设已有一个用户名admin, 密码admin
一段html代码
<template name="login">
{{#if currentUser}}
<h3>login success</h3>
{{else}}
<form>
<label>username:</label><input type="text" id="name"/>
<label>password:</label><input type="password" id="password"/>
<button type="submit" id="login"> login </button>
</form>
{{/if}}
</template>
coffee代码
Template.login.events
'click #login': (e)->
#e.preventDefault()
Meteor.loginWithPassword $('#name'), $('#password')
#false
这样子写的时候,每次输入完用户名和密码,网页都会闪烁一下又回到登录界面。解决的办法:去掉我上面的注释false,让函数返回一个false;或者是去掉e.preventDefault()的注释,问题都能解决了。
原因是什么?这个可以看看Meteor官网文档中preventDefault的作用。我的理解是,如果没有上面注释的代码,浏览器会在我们点击submit的时候,帮提交表单,但是由于上面的表单是没有action的,所以也就没任何效果。而如果使用preventDefault原因很明显。返回一个false,这个需要了解下js的事件处理机制,它的处理机制是bubble(冒泡)型的,如果返回一个false,就能够阻断继续向上bubble,也就阻断了浏览器提交表单的行为。
preventDefault()
Prevents the action the browser would normally take in response to this event, such as following a link or submitting a form. Further handlers are still called, but cannot reverse the effect.