HTML使用div容器模拟textarea

Question

我想创建一个小WYSIWYG编辑器。 想法： 首先，我想添加功能来编写和更改文本。所以我在我的div容器中添加了一个onClick和onKeyBoard Listener。当我点击div时，我将一个名为“focused”的变量设置为true。当一个关键事件被触发时，我检查focus是否为真。如果焦点是假的，则不会发生新的特征将被添加到光标的位置上。

我的问题： 这是正确的方法吗？我试图检查其他编辑器如何处理文本输入，但我无法得到它。

如果这是正确的方法 - 如何模拟闪烁的光标。在textarea中，光标会闪烁但是关于div容器的人是谁？单击后光标将隐藏隐藏。

Answer 1

我假设你这样做是为了娱乐/练习。如果您出于职业原因这样做，我强烈建议您不要重新发明轮子并使用Ckeditor，tinyMCE或YUI之类的东西。

有人说;你需要研究event handling。具体来说，对于关于聚焦的问题，您可以查看here。您描述的方式（将变量设置为true / false）似乎只会遇到问题。如果您使用标准事件属性（而不是设置“焦点”变量onclick），您应该定义要执行的函数，然后将它们设置为您正在侦听的元素的onfocus / onblur属性到。

那就是你没有使用像mootools，jquery，extJS等javacript库。如果你正在使用其中一个，他们可能有自己的处理事件的方式，所以你应该搜索他们各自的文档，看看如何实现事件处理程序。

再说一遍;你真的应该在div上使用textarea（除非我误解你只想在用户专注于你的div时做某事）。如果你只使用javascript从div中完全重新发明一个texteditor;那么没有javascript你的网页将无法正常运行。如果保留文本区域;用户仍然可以输入信息，您仍然可以获取表单提交的文本内容，但使用div表示您的网页只会在没有javascript的情况下变得无用。