Textedit显示html,index.html

.content{

background: red;

}

.active{

position: relative;

}

.add{

position: absolute;

top:0;

min-height: 4rem;

width:13rem;

background: #fff;

z-index: 9;

border:0.08rem dashed pink;

padding: .5rem;

}

.textarea{

min-width: 0.2rem;

min-height: 0.4rem;

/* position: absolute;

z-index: 9999; */

}

.parent{

/* border: 1px solid transparent;

outline: none; */

}

.add span{

padding: 3px;

border: 1px solid pink;

border-radius: 8px;

}

.upimg{

opacity: 0;

width: 100%;

height: 100%;

}

.upspan{

position: absolute;

width: 93px;

height: 34px;

overflow: hidden;

}

.a{

position: absolute;

top: 0;

left: 0;

}

啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊

aaaaaaaaaaaaaaaaaaaaaaaaaaaaa

啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊

啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊啊

这是这是一段可编辑的段落。请试着编辑该文本。

这是一段可编辑的段落。请试着编辑该文本。

这是一段可编辑的段落。请试着编辑该文本。

这是一段可编辑的段落。请试着编辑该文本。

// ready 方法

jQuery(function($){

$(document).on('click','.active',function(event){

event.stopPropagation();

// $(".active").removeClass("content");

$(".active>.add").remove();

// $(this).addClass("content");

let _html= $(this).text()

var html = '

'

html+='

'+ _html +'

'

html+='edit delUpImg'

html+='

'

$(this).append(html)

// $('

add | del

' ).appendTo(this);

// $('.parent').html(_html);

})

$(".add>span").click(function(event){

event.stopPropagation();

})

$('.active').on('click','.parent', function (e) {

// 清楚动态添加事件的冒泡事件

e.stopPropagation()

});

$('.active').on('click','.editBtn', function (e) {

e.stopPropagation()

var textVal = $(this).parent().children().find('.parent').val()

// $(".active>.add").remove();

// console.log($(this).parent().text())

$(this).parent().parent().text(textVal)

})

$('.active').on('click','.delBtn', function (e) {

// 清楚动态添加事件的冒泡事件

e.stopPropagation()

$(this).parent().parent().remove()

});

$('.active').on('click','.upspan', function (e) {

// 清楚动态添加事件的冒泡事件

e.stopPropagation()

});

})

// 递归函数

function getChildNode(node){

var nodeList = node.childNodes;

for(var i = 0;i < nodeList.length;i++){

var childNode = nodeList[i];

if(childNode.nodeType == 1){

childNode.className = "active"

getChildNode(childNode);

}

}

}

getChildNode(document.getElementById("content"));

一键复制

编辑

Web IDE

原始数据

按行查看

历史