English 中文(简体)
内容 表格四
原标题:contentEditable div replace innerHTML on the fly

是否有办法(除了园艺图书馆之外)改变内容 Editable Divinner Rainbow on the air, as on keyup, with no cursor status /cus loss? 我只想使用纯javascript代码,尽可能简单。

例如:

<div id="divId" contentEditable="true" onkeyup="change(this)"></div>

然后是 j:

function change(element)
{
  element.innerHTML = element.innerHTML.replace(/.../,  ... );
}

感谢。

最佳回答

如果你重新取代超文本,你将需要一些节约和恢复选择的手段。 备选办法如下:

  1. Insert elements with IDs at the start and end of the selection before the HTML replacement, retrieve them by ID afterwards and move the selection boundaries using those elements. This is the most robust method and is what Rangy does.
  2. Store some kind of character-based offset for the start and end of the selection before the HTML replacement and recreate the selection afterwards. This has all kinds of problems in the general case but may be good enough, depending on your needs. I ve posted functions on SO to do this before that depend on Rangy, but you could easily strip out the Rangy stuff if you don t mind losing support for IE < 9.
  3. Store and restore selection boundaries by pixel coordinates. Browser support for this is not good and will not be suitable if your HTML replacement changes the layout.
问题回答

这没有利用关键事件,但可能已经足够了? 适用于贵机构的说明显然只针对某一要素。

document.body.contentEditable= true ;
document.designMode= on ;
void 0;




相关问题
CSS working only in Firefox

I am trying to create a search text-field like on the Apple website. The HTML looks like this: <div class="frm-search"> <div> <input class="btn" type="image" src="http://www....

image changed but appears the same in browser

I m writing a php script to crop an image. The script overwrites the old image with the new one, but when I reload the page (which is supposed to pickup the new image) I still see the old one. ...

Firefox background image horizontal centering oddity

I am building some basic HTML code for a CMS. One of the page-related options in the CMS is "background image" and "stretch page width / height to background image width / height." so that with large ...

Separator line in ASP.NET

I d like to add a simple separator line in an aspx web form. Does anyone know how? It sounds easy enough, but still I can t manage to find how to do it.. 10x!

热门标签