搜索:
首页 >> JavaScript >> Js高级编程 >> 实现div可编辑的常见方法

实现div可编辑的常见方法

2007-11-6 作者:jxdawei 来源:jxdawei's blog 投递文章

功能:实现网页内容的即时编辑,增加页面的可用性、交互性。

方法1:直接通过textarea标签实现,请运行下边代码:

[提示:你可先修改部分代码,再按运行]

思路:将textarea通过CSS样式设计成让用户感觉不像是textarea的样子,通过onblur、oumouseout等属性进行ajax保存用户数据。

方法二:通过document.createElement的方法向页面增加input来实现。请运行下边代码:

[提示:你可先修改部分代码,再按运行]

思路:

1、当用户鼠标经过可编辑区域时,用背景色等方式提醒用户该区域可编辑。

2、当用户鼠标点击该区域时,也就是onclick事件时,先将原来的内容清掉,将临时创建出来一个输入框和一个输入按扭。

3、用户修改完后,点击“保存”按扭时通过ajax向数据库中写入新的数据。

Tags:编辑  div  ajax 
相关文章
手机版 Js高级编程 Asp之家 Aspxhome.com
闽ICP备06017341号