Ember.View 内容可编辑事件
Ember.View Contenteditable events
我正在尝试获取Ember.View来侦听由内容可编辑元素触发的事件,但是遇到了一点麻烦。
我要做的最终结果是将内容可编辑的更改绑定到 Ember 对象属性。
事件直接使用 jQuery 正确绑定,如以下答案所示:内容可编辑的变更事件
$(function () {
$(document).on('focus', '[contenteditable]', function(event) {
var $this = $(this);
console.log("$" + event.type);
return $this;
});
$(document).on('blur keyup paste', '[contenteditable]', function(event) {
var $this = $(this);
console.log("$" + event.type);
return $this;
});
});
但是在 Ember.View 上指定的事件处理程序永远不会被调用:
App.ContentEditable = Ember.View.extend({
item: App.Item.create({name:"Editable content"}),
tagName: "span",
contenteditable:"true",
attributeBindings: ["contenteditable"],
// Only event that gets triggered
click: function(){ console.log("click") },
// None of these events are triggered
focusin: function(){ console.log("focusin") },
focusout: function(){ console.log("focusout") },
keyup: function(){ console.log("keyup") },
blur: function(){ console.log("blur") },
paste: function(){ console.log("paste") },
});
我整理了一个 jsfiddle,显示.on()
事件已记录到控制台,但 Ember.View 上的事件不是:http://jsfiddle.net/chrisconley/RqSn4/
这是因为 Ember 中的事件名称被转换为更类似于 Ember 的命名约定。这些东西发生在packages/ember-views/lib/system/event_dispatcher.js中。如您所见,您必须将现有事件处理程序重命名为 keyUp
、 focusIn
和 focusOut
。
默认情况下不处理其他事件blur
和paste
,这就是customEvents
Ember.Application
的用途,请参阅 http://jsfiddle.net/pangratz666/CHVRt/
App = Ember.Application.create({
customEvents: {
blur: 'blur',
paste: 'paste'
}
});
相关文章:
- 将事件聚焦/模糊在可编辑内容的元素上
- 如何在tinymce编辑器中将点击事件绑定到html标签
- Primefaces编辑器模糊事件
- 我可以让我的网站的内容可编辑区域对安卓股票浏览器上的触摸事件更敏感吗
- 用于显示服务器端验证结果的 Jqgrid 编辑事件
- 当一个单元格被编辑时,是否有一个事件触发,但值没有'不要改变
- 在完整日历中单击时编辑事件
- 收听Aloha编辑器“aloha-smart-content-change”事件
- 如何在角度可编辑中应用于更改事件
- Ace 编辑器上的键控事件
- 谷歌地图可编辑多边形过滤器 从set_at事件中拖动事件
- 没有 x 可编辑表元素的事件侦听器
- jqGrid如何处理事件在编辑列后输入键,这要归功于editRow
- 在拖动/拖放事件上获取 Firefox 内容可编辑的拖放光标位置
- 使用模式引导在全日历中编辑事件
- 如何在全日历中编辑事件
- Ember.View 内容可编辑事件
- 在ui-grid编辑事件上与gridData交互
- 如何在JsGrid中自定义编辑事件
- 如何更改x可编辑事件顺序