在这里完成YUI新手。
当用户在YUI3文本编辑器控件中键入文本时，我需要为文本背景动态着色，如下所示：
文本的第一行是橙色。
直到以--开头的行之前的所有行均为橙色。
在那之后的所有行，包括以--开头的行，直到以--开头的下一行，都是蓝色。
之后–再次变为橙色，依此类推。
如果第一行以--开头，则仍应为橙色。
用户不得对可视文本样式进行任何手动控制，必须在粘贴时将纯文本插入并重新着色。
用户键入文本时，必须实时更新文本背景色。
例：
橙色橙色
橙子
橙子
-蓝色蓝色
蓝色 -
蓝色
- 橙子
- 蓝色
-橙色橙色
橙子
请指出我从哪里开始研究如何实现这一点。我浏览了这些示例，但还不能完全理解这些内容。
注意：如果您知道适合我需要的更合适的编辑器，请使用任何明智的JS框架。
最佳答案
我认为您要查看的示例是YUI3 nodeChange。对于您的应用程序，您将需要查找“ enter-up” nodeChange事件。然后，您应该能够使用e.dompath中的NodeList来获取要设置样式的正确Node。为了使您入门，请使用以下示例替换示例中的“ logFn”函数：
var logFn = function(e) {
Y.log('nodeChange Event: ' + e.changedType);
if (e.changedType === 'enter-up') {
var pContainerOfNewBr = e.dompath.item(1);
var pContainerOfPrevLine = pContainerOfNewBr.previous();
pContainerOfPrevLine.setStyle('backgroundColor', '#0000ff');
Y.log('nodeChange got enter-up: ' + e.changedType);
}
};
并将“ on”侦听器更改为“ after”。
editor.after('nodeChange', logFn);
您应该从中看到的是，在一行上单击“ enter”（输入）后，前一行的背景色应变为蓝色。并非完全符合您的要求，但希望朝着正确的方向发展。
警告-富文本编辑器是一个非常复杂的小部件，您可以首次体验YUI3。如果您能很好地掌握YUI3事件和节点，将会更加容易，尽管如果您需要破解实际的RTE代码，可能会遇到很大的挑战。