contenteditable

return the range object of the word before or upon carret position in contenteditable div

由 孤人 提交于 2019-12-25 03:43:15
问题 After research, i came accross few answers by @Tim Down but still did not quench my thirst. What i want is to delete the contents of range containing the word before or upon carret in contenteditable div. Assuming | represent carret position. Example: @TimDown is a #GoodJavascriptProgrammer| and .... if i click a delete button, i should delete word #GoodJavascriptProgrammer with # symbol included and set cursor back to its position. see my fiddle delete last string before carret function

How can I type inside the parent contentEditable div?

由 送分小仙女□ 提交于 2019-12-25 02:01:50
问题 How can you type inside a contentEditable div outside of a child contentEditable div without retaining the child's class, and without changing contenteditable to false. FIDDLE <div class ="container" contenteditable="true"> <span class="meatball" contenteditable="true">meatball</span> </div> Should be this: <div class ="container" contenteditable="true"> <span class="meatball" contenteditable="true">meatball</span> spaghetti </div> Not this: <div class ="container" contenteditable="true">

Change font for selected text using JavaScript

由 匆匆过客 提交于 2019-12-24 23:09:27
问题 How can I change the font when I highlight a specific text from the div. The code below changes the font of the whole text when I select a font from my dropbox. function changeFont(font) { document.getElementById("note_header").style.fontFamily = font.value; } Highlight text and change font <br> <select id="select_font" onchange="changeFont(this);"> <option value="Arial">Arial</option> <option value="Sans Serif" selected>Sans Serif</option> <option value="Comic Sans MS">Comic Sans MS</option>

WYSIWYG Editor place HTML content in current position

由 一笑奈何 提交于 2019-12-24 22:36:53
问题 I am using a WYSIWYG Rich Text Editor from mindmup I added a dropdown box in toolbar I use this dropdown to fetch the content from server and append/prepend to the existing content in the Editor where the cursor is pointing. But it is not adding the data to the editor. I referred Insert html at caret in a contenteditable div and Insert text at cursor in a content editable div But they are not working for me. This is the function i used to fetch the data when changing drop down function

Span with contenteditable attribute won't behave as an inline element in IE11

由 坚强是说给别人听的谎言 提交于 2019-12-24 21:34:27
问题 I am having two span elements inside a div that has limited width. The text content of the two merge seamlessly into one continuous "paragraph". However, I need the second span to be a contenteditable="true" . But when I add the attribute, the text of the second element starts from a new line in IE11. <div style="width:200px"> <span>4.5</span> <span contenteditable="true">Test this simple layout in IE11 and see the wonders of the internet!</span> </div> Here is the JsFiddle for you to play

Cannot use contenteditable widget on server side paged tablesorter

由 谁说我不能喝 提交于 2019-12-24 17:29:14
问题 I have a tablesorter project which has been working good with client side paging since some months. Now I have to turn it to server side paging but I can't get it to work with all the features I was using with client side version. As on subject, my problem is to make the contenteditable feature to work. What I've done to achieve that, is to write a custom function to bind to ajaxProcessing handler on the tablesorterPager config: ajaxProcessing: function (data) { if (data && data

ContentEditable iframe is not editable in firefox

由 一世执手 提交于 2019-12-24 14:17:30
问题 I am having an issue with contentEditable iframes in Firefox. I created an iframe for pasting rich text and it worked excellently in Chrome. However, for some reason the iframe is not editable in Firefox and IE. When I load the iframe in FF, the cursor blinks in the iframe and then disappears, never to return. Here is the HTML as it loads in Chrome: <iframe id="atto_pastespecial_iframe" frameborder="0" style="border: 1px solid gray"> #document <html> <head></head> <body contenteditable="true"

Contenteditable in HTML tables

由 不羁岁月 提交于 2019-12-24 14:01:24
问题 With the code: <table> <tr><td contenteditable>My_Name</td><td>Surname</td></tr> <tr><td contenteditable>My_Name2</td><td>Surname2</td></tr> </table> You can edit a cell in an HTML table. My problem is when I edit the cell and press enter , it creates a new line in cell. What I really would like is, if I press enter I go to the cell just below that cell I just edited so that I can edit that cell. Currently I have to use the mouse to go to the next cell, but if I can press enter and go to the

How do I figure out why the contenteditable attribute doesn't work?

由 ▼魔方 西西 提交于 2019-12-24 10:57:21
问题 I seem to be having an issue with some of my css/javascript. I can't seem to be able to get contentEditable to work in my webapp. I was inspired by the answer to this post to try this method. I've tested my browser here and it works fine. Are there any css rules I should be aware of that may be causing it to not work? I can select the object (it highlights the div) but I can't edit/append/delete any text in the object. I have also made sure that document.designMode = "on" Unfortunately it's

Set width of ace editor instance according to the length of characters in it

由 一曲冷凌霜 提交于 2019-12-24 07:38:46
问题 I am working on the project where I have created a custom Rich Text Editor using contenteditable attribute. In this rich text editor I want insert single line ace editor instance of which width will be set according to the number of characters in it. For restricting the ace editor instance to single line I have handled the "Enter" key event which does not let the ace instance to insert new line. var editor = ace.edit(script_editor); editor.commands.on("exec", function (e) { editor.container
订阅 contenteditable