草庐IT

contenteditables

全部标签

javascript - contenteditable 文本选择不起作用

我面临以下问题:当我尝试在contenteditable元素中选择文本并且选择的结尾是元素内容的开始时,没有触发选择事件并且没有Selection和Range对象。有人可以就为什么会发生这种情况或如何防止这种情况给我任何建议吗?负责获取选择范围的代码:$('div[contenteditable="true"]').bind("mouseupkeyuptouchend",function(){lastCaretIndex=getSelectionRange();});functiongetSelectionRange(){varsel;if(window.getSelection){s

javascript - 对于所见即所得编辑器,在 div 上使用 contenteditable 有多可靠?

我相信这个标题是不言自明的,但也许我还是应该问详细点。我正在构建一个WYSIWYG编辑器,而我真的才刚刚开始。所以,我意识到也许了解利弊会启发我。基本上,我的问题是,因为我想要一个至少可以在所有主要浏览器中使用90%的编辑器,我可以在div中使用contenteditable多远,以及与designMode和iframe相比,使用contenteditable的优缺点是什么?此外,在研究过程中我发现了thiseditor.我相信它没有使用这些属性中的任何一个,而是在移动textarea的位置。这是更好的方法吗?好吧,我知道有很多因素会影响最后一个问题的答案,但正如我提到的,我在编辑器中

javascript - 突出显示/选择具有范围的多个div/contenteditable?

假设我有一组contenteditable="true"div。我不能只有一个div,必须有多个div。我怎样才能突出显示多个div的内容?使用范围?还有什么吗? 最佳答案 答案是这取决于浏览器。参见thisexample使用Ranges测试两种方法。第一次尝试为每个可编辑的创建一个范围并将它们全部添加到选择中。第二次尝试创建包含两个可编辑内容的单个范围结果:在所有浏览器中,用户不可能创建存在于多个可编辑元素中的选择;Firefox是最宽容的主要浏览器。两种编程方法都有效。Safari和Chrome是最宽松的:这两种方法都不会从多个

javascript - Webkit:实时图像在 contenteditable 容器中调整大小

我正尝试在Chrome的contenteditordiv中拥有可调整大小的图像,就像Firefox那样。当您单击图像时,应出现调整大小处理程序。我尝试了jQueryUI可调整大小的插件,但是当您移动(拖放)容器内的图像时它会损坏。也尝试了CSS3resize属性,但它只适用于block元素,不适用于有什么建议吗?谢谢 最佳答案 不幸的是,WebKit不支持在可编辑元素中调整图像和表格的大小。https://bugs.webkit.org/show_bug.cgi?id=7154https://bugs.webkit.org/show

javascript - contenteditable 和非按钮元素

如果使用按钮,我可以轻松地对可编辑的选择执行execcommand。但是,使用任何其他元素都会失败。http://jsbin.com/atike/edit这是为什么,我怎样才能使用div元素使其工作。谢谢。 最佳答案 您可以通过在正在使用的元素上使用mousedown事件而不是按钮来保存选择,并在click事件中聚焦可编辑元素后再次恢复它。我修改了示例代码:http://jsbin.com/atike/40/edit.这是代码:functionsaveSelection(){if(window.getSelection){sel=w

javascript - 如何在 UIWebView iOS5 中预选 contenteditable 字段

首先,我知道contenteditable仅适用于iOS5我已经说明了这一点-我们为iOS5用户提供了一项功能,允许使用contenteditable进行富文本粘贴。到目前为止,此功能非常有效,我想做的就是当View似乎将contenteditable字段设置为事件(预选)以便出现键盘并且用户可以立即开始键入。这是我用于UIWebView的本地html文件PLACEHOLDER我已经尝试使用一些javascript来完成此操作,使用我找到的用于预选文本输入的教程。我无法让它工作,即使我试图切换到文本输入字段进行测试。这可能是由于我对javascipt缺乏经验,所以如果这是解决方案,请明

javascript - 在 contentEditable 元素中插入 HTML 元素

我有一个contentEditablediv,我想在其中插入HTML标签(一个简单的span元素)。是否有跨浏览器解决方案允许我将这些标签插入我的div选择或光标位置。如果在页面上(不在div中)选择了其他内容,我想将标记附加到div的末尾。谢谢 最佳答案 这是一个启动//gettheselectionrange(orcursorposition)varrange=window.getSelection().getRangeAt(0);//createaspanvarnewElement=document.createElement

javascript - 检测浏览器是否支持 contentEditable?

有thisquestion,但发布的解决方案是浏览器嗅探,我试图避免这种情况。我需要让我的网站与iPad兼容,也许还有更新的Android设备。我一直在为我的WYSIWYG编辑器使用旧版本的FCKEditor(现在是CKEditor),但这在移动设备上不起作用,所以我想将它换成带有markdown之类的简单文本区域(如果不支持的话).据说它不会工作,因为移动设备往往不支持此contentEditable属性,这意味着当您单击它时屏幕键盘不会弹出。如何检测浏览器是否支持contentEditable?有人建议我只用mydiv.contentElement===undefined之类的东西

javascript - webkit stylewithcss contenteditable 不工作?

我正在尝试使用contenteditable和styleWithCss。在webkit中好像不行。每当我使用execCommand时,它都会生成一个而不是我预期的跨度。这是一个演示:http://jsbin.com/izomo/2/edit选择部分文本,单击粗体按钮,然后查看html输出。这是一个错误还是我做错了什么。非常感谢。 最佳答案 我无法让它与此处两个答案中的命令一起使用。对于那些仍在为这个问题苦思冥想的人,这是如何让它发挥作用的。我们可以将三个值传递给execCommanddocument.execCommand(comm

javascript - 需要将光标位置设置到 contentEditable div 的末尾,选择和范围对象问题

我暂时忘记了跨浏览器兼容性,我只是希望它能工作。我正在做的是尝试修改位于typegreek.com的脚本(您可能不需要知道这一点)找到基本脚本here.基本上它的作用是当您输入字符时,它将您输入的字符转换为希腊字符并将其打印到屏幕上。我想要做的是让它在contentEditablediv上工作(它只适用于Textareas)我的问题是这个函数:用户键入一个键,它被转换为希腊键,然后转到一个函数,它通过一些if排序,它最终到达的地方是我可以添加div支持的地方.这是我目前所拥有的,myField是div,myValue是希腊字符。//Getselectionobject...varuse