•handlebars.js 模板1
代码如下 | 复制代码 |
<input type="text" placeholder="请输入用户名" {{bind-attr value="username"}}> |
•Ember.TextField
Ember.TextField 是 Ember.js 内建的一个 View 类2,
代码如下 | 复制代码 |
//template {{view Ember.TextField valueBinding="value" placeholder="请输入用户名"}} •扩展 Ember.TextField 类 // js }); // template |
需求:对 input 里填写的用户名,我需要发起 ajax 请求到服务器,验证该用户名是否可用。
触发验证的时机:输入框失焦时。在 Ember.js 里,该事件为 foucusOut。我会在 input 输入框失去焦点时向服务器 API 接口请求结果。
一个最快的解决办法是,直接把事件绑定给 View 类的属性(以下说明均基于上面的第三种写法),如下3:
代码如下 | 复制代码 |
App.UsernameTextField = Ember.TextField.extend({ focusOut: function(evt){ var username = this.get('value'); console.log(username); //这里我可以使用 jQuery 发起 ajax 请求远程服务器进行表单验证 $.post('http://www.example.com/api/user', {username: username}, function(response) { console.log(response); }); } }); |
因为我们在模板里对 value 做了双向绑定4,所以 View 里可以通过 this.get('value') 取得当前输入框的值。这样,在输入框失去焦点后,就可以将取得的用户名通过 ajax 请求发送到服务器要求验证
原文来自:zfanw.com
时间: 2024-10-27 05:42:47