contenteditable

Why Is My Contenteditable Cursor Jumping to the End in Chrome?

由 安稳与你 提交于 2019-12-29 05:51:34
问题 Scenario I have a contenteditable <div> area, and within this area I may have some <span contenteditable="false"></span> containing some text. The idea is, these span elements will represent styled text that can not be edited, but may be deleted from the <div contenteditable="true"></div> area by pressing the backspace key. Issue The cursor placement is the big issue here. if you delete one of these <span> elements, the cursor jumps to the end of the <div> . More interesting, if you type some

Autolink URL in ContentEditable Iframe

由 泄露秘密 提交于 2019-12-29 00:45:14
问题 I have a content editable Iframe I want to autolink it, like : My content editable Iframe look like i tried using regular expression in this Question i asked before. The function that i use in this question works fine, but actually it will replace all links including links in tags (IMG, existing A HREFs). But i dont want to use regx if i use regx convertion happens when i click any submit or save button. When a user paste's a url in a content editable Iframe it should automatically convert

AngularJS and contentEditable two way binding doesn't work as expected

由 北慕城南 提交于 2019-12-28 08:07:07
问题 Why in the following example the initial rendered value is {{ person.name }} rather than David ? How would you fix this? Live example here HTML: <body ng-controller="MyCtrl"> <div contenteditable="true" ng-model="person.name">{{ person.name }}</div> <pre ng-bind="person.name"></pre> </body> JS: app.controller('MyCtrl', function($scope) { $scope.person = {name: 'David'}; }); app.directive('contenteditable', function() { return { require: 'ngModel', link: function(scope, element, attrs, ctrl) {

Make a <br> instead of <div></div> by pressing Enter on a contenteditable

由 泪湿孤枕 提交于 2019-12-28 00:52:05
问题 I've written a bit of code in my keyboard event handler to insert a <br> in response to the press of the Enter key: event.preventDefault(); document.execCommand('InsertHTML', true, '<br>'); This only works if the cursor is between two Letters, if its on the end i need two <br> -Elements. Can i detect if i'm on the end of a Line? Or some other working idea for the Enter problem? I also tried to catch the normal key-event (wothout the ctrl-Key pressed) and create a keyboard-event with JS where

Make a <br> instead of <div></div> by pressing Enter on a contenteditable

由 别来无恙 提交于 2019-12-28 00:51:11
问题 I've written a bit of code in my keyboard event handler to insert a <br> in response to the press of the Enter key: event.preventDefault(); document.execCommand('InsertHTML', true, '<br>'); This only works if the cursor is between two Letters, if its on the end i need two <br> -Elements. Can i detect if i'm on the end of a Line? Or some other working idea for the Enter problem? I also tried to catch the normal key-event (wothout the ctrl-Key pressed) and create a keyboard-event with JS where

Dealing with line Breaks on contentEditable DIV

由 萝らか妹 提交于 2019-12-27 13:42:47
问题 I have a problem with contenteditable line breaks on SAFARI/CHROME. When I press "return" on a contentEditable <div> , instead of creating a <br> (like Firefox), they create a new <div> : <div>Something</div> <div>Something</div> That looks like (on the contentEditable DIV): Something Something But after sanitization (removing <div> ), I get this: SomethingSomething In Firefox, the contenteditable is: Something <br> Something And that after sanitization looks the same: Something Something Is

Dealing with line Breaks on contentEditable DIV

由 好久不见. 提交于 2019-12-27 13:39:40
问题 I have a problem with contenteditable line breaks on SAFARI/CHROME. When I press "return" on a contentEditable <div> , instead of creating a <br> (like Firefox), they create a new <div> : <div>Something</div> <div>Something</div> That looks like (on the contentEditable DIV): Something Something But after sanitization (removing <div> ), I get this: SomethingSomething In Firefox, the contenteditable is: Something <br> Something And that after sanitization looks the same: Something Something Is

Dealing with line Breaks on contentEditable DIV

由 可紊 提交于 2019-12-27 13:39:05
问题 I have a problem with contenteditable line breaks on SAFARI/CHROME. When I press "return" on a contentEditable <div> , instead of creating a <br> (like Firefox), they create a new <div> : <div>Something</div> <div>Something</div> That looks like (on the contentEditable DIV): Something Something But after sanitization (removing <div> ), I get this: SomethingSomething In Firefox, the contenteditable is: Something <br> Something And that after sanitization looks the same: Something Something Is

Programmatically select text in a contenteditable HTML element?

由 不想你离开。 提交于 2019-12-27 10:38:56
问题 In JavaScript, it's possible to programmatically select text in an input or textarea element. You can focus an input with ipt.focus() , and then select its contents with ipt.select(). You can even select a specific range with ipt.setSelectionRange(from,to). My question is: is there any way to do this in a contenteditable element too? I found that I can do elem.focus() , to put the caret in a contenteditable element, but subsequently running elem.select() doesn't work (and nor does

Paste </p> closing tag without spawning an opening p tag in contenteditable

由 流过昼夜 提交于 2019-12-25 18:30:31
问题 I've got a contenteditable div: <div id="result" class="content" contenteditable="true"><p><br/></p></div> I want new paragraphs to form when I press ENTER, and for that I intercept ENTER keydown and replace the default action by the insertion of a html code: $(".content").on("keydown",function(e){if(e.which == 13) { e.preventDefault(); pasteHtmlAtCaret("</p><p><br/>");}}); My hope was that when I press ENTER, the </p><p><br/> would close the existing paragraph and open a new paragraph. So,
订阅 contenteditable