草庐IT

javascript - 有没有一种灵活的方法来修改可编辑元素的内容?

主题:我正在创建一个通过内容脚本和事件页面与网页交互的GoogleChrome扩展程序。如果用户单击分类为editable的元素,我会出现上下文菜单选项通过chrome.contextMenusAPI.选项就像常用输入文本的快捷方式。当用户单击一个选项时,一些文本将放置在光标位置的元素内。如果用户突出显示了文本,则会将其删除。问题:并非所有可编辑元素都可以用相同的方式修改。如果元素是一个简单的textarea通过实现此解决方案可以实现预期的结果:Replacingselectedtextinthetextarea但是,我不能假设我正在与一个正常的textarea进行交互.可能的细微差别

html - 如何使 <input type ="file"/> 可编辑?

我找到了一些示例来解释如何使inputtype=file不可编辑。喜欢但我在VisualStudio中制作了测试应用程序并发现默认情况下不可编辑。如何让它可以编辑?谢谢 最佳答案 的行为元素受到浏览器的严格控制,你不能强制他们做他们想做的事情以外的任何事情。通常,现代浏览器只允许使用文件选择器来选择要上传的文件。您的Javascript代码无法设置该值,并且只能看到尾文件名(没有前缀目录名的名称)。 关于html-如何使<inputtype="file"/>可编辑?,我们在Stac

javascript - 在内容可编辑的 div 中设置光标位置

总结:我正在尝试实现用户键入(时的效果或[在内容可编辑div,第二个)或]是自动插入的,插入符号位于它们两者之间,即(之间和).FIDDLE在--的右侧键入s并查看它在第一行中如何工作而在第二行中不起作用。我的努力:我正在使用此代码(通过TimDown)来突出显示文本的某些部分并设置光标位置。前者有效但后者无效:(functiongetTextNodesIn(node){//helpervartextNodes=[];if(node.nodeType==3){textNodes.push(node);}else{varchildren=node.childNodes;for(vari=

javascript - 从内容可编辑的 div 中获取已删除的字符

我正在使用contenteditablediv因为我想在文本区域显示用户选择的表情符号。我想知道什么字符是用退格键或删除按钮删除的。是否可以通过jquery或javascript获取字符?更新这根本不是重复的,因为所有答案都是关于如何跟踪按下的键而不是关于被选中的字符。 最佳答案 我没有干净的解决方案。但是如果你按下退格键,这个会向你显示删除的字符:varlastText=$('#editable').text();$('#editable').keyup(function(event){if(event.which==8||eve

javascript - 在不重置插入符号(光标)位置的情况下修改内容可编辑的 div 中的文本

我正在尝试替换/anythinginhere/的所有实例与/anythinginhere/即时,因为在内容可编辑的div中进行了更改。我当前的实现有效,但在每次按键时,插入符都会移动到div的开头,从而使实现无法使用。有没有办法在替换div的内容时保持插入符号的位置?$('.writer').on('keyup',function(e){$(this).html($(this).html().replace(/\/(.*)\//g,'\/$1\/'));}); 最佳答案 尝试一下demo$('#writer').on('keyup'

javascript - 在内容可编辑的 div 中显示拼写检查器的建议

我正在为一种印度语言开发拼写检查器。到目前为止,拼写检查器能够找到拼写错误的单词。我为此目的使用内容可编辑的div。所以现在我需要在用户右键单击或选择错误单词时显示拼写错误的建议,以显示替换为错误拼写的单词或简单地忽略它。我在perl中有一个建议生成器算法。我只需要与javascript链接。我一直在研究如何显示建议(在光标处绘制菜单)。我在搜索Google后找到了一些代码。但无法更进一步。if(document.addEventListener){document.addEventListener('contextmenu',function(e){alert("You'vetrie

html - 为什么人们会选择可编辑的 DIV 而不是 INPUT 或 TEXTAREA

Thereareseveralquestions关于询问如何使div可编辑。然而,人们可以只使用文本区域或输入字段并将它们禁用或只读。我猜这会产生更好的语义。即使是MDN给出的例子在我看来就像一个普通的旧输入字段。那么我为什么要使用可编辑的div?与文本区域和输入字段相比,它有什么优势?我刚刚看了anexample我在标签wiki中找到了contenteditable.优点是我可以在可编辑的div中使用标记,但不能在文本区域或输入字段中使用标记?允许child进入文本区域在语义上不是更正确吗?或者引入一个全新的元素,就像他们在HTML5中所做的那样。像richtextarea这样的东西

javascript - 内容可编辑 : How to completely remove span when pressing del or backspace

我有一个contenteditablediv,如下面的HTML所示(由|标记的脱字符号)。我想在按backspace或delete时删除span.label(即跨度充当单个字母,因此用户看起来好像Name在一次按键中被删除了)Hallo,Name|,thisisademonstrationofplaceholders!Sincerly,yourAuthor 最佳答案 您需要检查光标是否位于跨度末尾的确切位置,如果是-将其删除:document.querySelector('div').addEventListener('keydow

html - div 内容可编辑但只读

我有一个带有一些文本的div,我希望当光标悬停在这个div上时选择文本。如果我让这个div保持原样,当我尝试全选(CTRL+A)时,我会选择所有页面内容,即所有正文。为了摆脱这个,我需要为这个div使用contenteditable属性。但我不想让人改文字/复制/剪切等等我尝试对这个div使用只读,但不起作用。有什么建议吗?PS1:这个div里面还有其他标签(html内容),但我不认为这是个问题。PS2:这里有一个例子:jsfiddle.net/msakamoto_sf/wfae8hzv/-但有一个问题。你可以剪切文本:( 最佳答案

html - 具有浮点验证的 AngularJS 可编辑数字字段

我对AngularJS有疑问。如果我使用xeditable我无法输入float...那么,如何添加float并在View中进行浮点验证? 最佳答案 您需要设置step的属性标记为“任何”。解决这个问题的一种方法是利用xeditable的e-*语法,其中您指定的任何属性以e-开头将被传递到底层输入标签:{{some.object||'EnterNumber'}} 关于html-具有浮点验证的AngularJS可编辑数字字段,我们在StackOverflow上找到一个类似的问题: