最新下载
热门教程
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
Ember.js 模板添加 HTML5 属性
时间:2014-03-03 编辑:简简单单 来源:一聚教程网
最近开发一个 Chrome 扩展,因为基于 Chrome 浏览器,所以就放心大胆地用各种新技术,比如1:
代码如下 | 复制代码 |
required2 是 HTML5 增加的元素属性,应用于表单中 input、select、textarea 元素,表示它们是必须项,用户需要填写才能提交。如果提交空内容,浏览器就会显示原生的错误消息,比如:请填写此字段。
在 Ember.js 下,上面的 Email 输入框代码会是这样写的3:
代码如下 | 复制代码 |
{{view Ember.TextField name='email' valueBinding='email' type='email' placeholder='请输入邮箱地址' required='required' title='请输入邮箱地址'}} |
检查 Ember.js 生成的 HTML 代码:
代码如下 | 复制代码 |
可以看到,required 与 title 两个属性被抛掉,这是因为 Ember.TextField 原生支持的 HTML 属性有限。但 HTML5 里,像 data-* 这样的属性是经常出现的,required 也很常见。不能因为 Ember.js 原生不支持这样的属性就不用。
Ember.js 提供了一个非常简单的 reopen 方法4,直接扩展 Ember.TextField 类的实例方法和实例属性:
代码如下 | 复制代码 |
Ember.TextField.reopen({ |
再检查 Ember.js 生成的 HTML 代码:
代码如下 | 复制代码 |
已经成功地给 Ember.js 模板加入 HTML5 属性了。
-
上一个: jquery文章阅读时间进度条预览例子
-
下一个: Ember.js 表单验证的使用例子
相关文章
- JS实现直接运行html代码的方法 06-22
- JS html时钟制作代码分享 05-20
- html5中placeholder兼容js代码 08-06
- 给HTML标签中的属性添加双引号js代码 09-01
- js中outerHTML innerHTML与innerText区别与用法 11-15
- js检测text文本输入框中是否有html代码 09-26