jsdom可编辑div
程序员文章站
2024-03-20 10:45:58
...
window.onload = function() {
// 加载的时候就被初始化,此处的this是指id为oldDiv的div
document.getElementById("divElement").ondblclick = function() {
toReplace(this)
}
}
// 此函数功能是新建一个input元素替换div
//当input元素失去焦点时又变回原来的div
toReplace = function(divElement) {
// 创建一个input元素
var inputElement = document.createElement("input");
// 把obj里面的元素以及文本内容赋值给新建的inputElement
inputElement.value = divElement.innerHTML;
// 用新建的inputElement代替原来的oldDivElement元素
divElement.parentNode.replaceChild(inputElement, divElement);
// 当inputElement失去焦点时触发下面函数,使得input变成div
inputElement.onblur = function() {
//把input的值交给原来的div
divElement.innerHTML = inputElement.value;
//用原来的div重新替换inputElement
inputElement.parentNode.replaceChild(divElement, inputElement);
}
}
下一篇: Java发送邮件(网易邮箱)
推荐阅读
-
jsdom可编辑div
-
DIV 显示边框 和 JS设置DIV可编辑,附送DTHML 中文手册 JavaScriptCSSHTML
-
蛇年多屏图片切换(可添加图片链接以及编辑标题)
-
蛇年多屏图片切换(可添加图片链接以及编辑标题)
-
使用#default#userdata组件实现的可记忆内容的编辑器
-
Spring 源码个人浅浅分析(6)--- 功能可扩展之属性注册编辑器ResourceEditorRegistrar
-
使用#default#userdata组件实现的可记忆内容的编辑器
-
JQuery实现可实时编辑操作的表格功能
-
js实现右下角可关闭最小化div(可用于展示推荐内容)_javascript技巧
-
contenteditable可编辑div插入图片