Question

当发生TinyMCE编辑器模糊时，我试图找到触发模糊事件的textarea的元素id（或名称）。我还想要获得焦点的元素的元素id（或名称），但该部分应该是相似的。

我越来越接近能够获得tinymce编辑器的iframe ID，但我只是让它在Chrome中工作，我确信有更好的方法。我需要这个在不同的浏览器和设备上工作。

例如，下面的代码会返回Chrome中的iframe ID，这是正常的，因为iframe ID只会附加＆＃34; _ifr＆＃34;的后缀。到我的textarea元素id。我更喜欢textarea的元素id，但如果我需要删除iframe后缀，那就没关系。

编辑：我认为如果我添加一个完整的TinyMCE小提琴（而不是下面的代码）会更清楚： http://fiddle.tinymce.com/HIeaab/1

＆＃13;

setup : function(ed) {
	ed.onInit.add(function(ed) {
		ed.pasteAsPlainText = true;
/* BEGIN: Added this to handle JS blur event */
/* example modified from: http://tehhosh.blogspot.com/2012/06/setting-focus-and-blur-event-for.html */
		var dom = ed.dom,
		doc = ed.getDoc(),
		el = doc.content_editable ? ed.getBody() : (tinymce.isGecko ? doc : ed.getWin());
		tinymce.dom.Event.add(el, 'blur', function(e) {
			//console.log('blur');

			var event = e || window.event;
			var target = event.target || event.srcElement;
			console.log(event);
			console.log(target);
			console.log(target.frameElement.id);
			console.log('the above outputs the following iframe id which triggered the blur (but only in Chrome): ' + 'idPrimeraVista_ifr');
		
		})
		tinymce.dom.Event.add(el, 'focus', function(e) {
			//console.log('focus');
		})
/* END: Added this to handle JS blur event */
	});
}

＆＃13;

或许最好给出我想要完成的事情的背景：我们在表单上有多个textareas，我们正在尝试＆＃34; grammarcheck＆＃34;使用名为＆＃34; languagetool＆＃34;的软件（使用TinyMCE版本3.5.6）。在失去对textarea的关注之后，我们想要为失去焦点的textarea调用语法检查，然后将焦点返回到语法检查后它应该去的地方。

我已经挣扎了很长一段时间，并且非常感谢任何反馈（即使这样做的一般建议不同）。

非常感谢！

Answer 1

简化

TinyMCE在Editor对象上提供了一个属性，用于获取编辑器实例ID：Editor.id

检查doc.content_editable和tinyMCE.isGecko似乎也有些过分，因为Editor.getBody()已经允许跨浏览器兼容的事件绑定（我检查了IE8-11，以及最新版本的Firefox和Chrome）。

注意：我实际上发现逻辑无法在Internet Explorer中正确地将ed.getBody()分配给el，因此无法实现您所需的跨浏览器功能。< / em>的

尝试以下简化事件绑定：

tinyMCE.init({ mode : "textareas", setup : function (ed) { ed.onInit.add(function (ed) { /* onBlur */ tinymce.dom.Event.add(ed.getBody(), 'blur', function (e) { console.log('Editor with ID "' + ed.id + '" has blur.'); }); /* onFocus */ tinymce.dom.Event.add(ed.getBody(), 'focus', function (e) { console.log('Editor with ID "' + ed.id + '" has focus.'); }); }); } });

<强> …or see this working TinyMCE Fiddle »

旁白：你的小提琴没有正确初始化编辑器，因为插件无法加载。由于您不需要此示例的插件，因此我将其从小提琴中删除以使其正常工作。

TinyMCE 3 - 发送模糊事件的textarea id

1 个答案:

简化