实现div可编辑的常见方法

实现div可编辑的常见方法
功能:实现网页内容的即时编辑,增加页面的可用性、交互性。
方法1:直接通过textarea标签实现,请运行这个Demo。

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

方法二:通过document.createElement的方法向页面增加input来实现。请运行这个Demo。

思路:
1、当用户鼠标经过可编辑区域时,用背景色等方式提醒用户该区域可编辑。
2、当用户鼠标点击该区域时,也就是onclick事件时,先将原来的内容清掉,将临时创建出来一个输入框和一个输入按扭。
3、用户修改完后,点击“保存”按扭时通过ajax向数据库中写入新的数据。



你可能感兴趣的:(Ajax,css)