JS实现双击编辑可修改状态 js实现双击编辑,点击他处时自动保存。(如下代码可直接运行,无需jquery系列jar)

var isedit=false

function editRow(e,isedit){
var that =e.parentNode.parentNode
var e = e= e=(that)
if(isedit){
console.log($e.find(".Ctype"))
$e.find(".edit").css({display:“none”})
e . f i n d ( " . s a v e " ) . c s s ( d i s p l a y : " b l o c k " ) / / t h a t [ 1 ] . i n n e r H T M L = ′ < i n p u t t y p e = " t e x t " n a m e = " m e s s a g e " p l a c e h o l d e r = " T y p e M e s s a g e . . . " c l a s s = " f o r m − c o n t r o l " > ′ v a r c o n t e n t = ′ < t e x t a r e a i d = " i n p u t D e s c r i p t i o n " c l a s s = " f o r m − c o n t r o l " r o w s = " 5 " p l a c e h o l d e r = " . . . " > < / t e x t a r e a > ′ v a r c t y p e = e.find(".save").css({display:"block"}) // that[1].innerHTML='<input type="text" name="message" placeholder="Type Message ..." class="form-control">' var content = '<textarea id="inputDescription" class="form-control" rows="5" placeholder="..."></textarea>' var ctype = e.find(".save").css(display:"block")//that[1].innerHTML=<inputtype="text"name="message"placeholder="TypeMessage..."class="formcontrol">varcontent=<textareaid="inputDescription"class="formcontrol"rows="5"placeholder="..."></textarea>varctype=e.find(".Ctype").text()
$e.find(".Ctype").html(content)
e . f i n d ( " . C t y p e t e x t a r e a " ) . v a l ( c t y p e ) v a r c c o n t e n t = e.find(".Ctype textarea").val(ctype) var ccontent = e.find(".Ctypetextarea").val(ctype)varccontent=e.find(".Ccontent").text()
$e.find(".Ccontent").html(content)
e . f i n d ( " . C c o n t e n t t e x t a r e a " ) . v a l ( c c o n t e n t ) v a r c m a r k = e.find(".Ccontent textarea").val(ccontent) var cmark = e.find(".Ccontenttextarea").val(ccontent)varcmark=e.find(".Cmark").text()
$e.find(".Cmark").html(content)
KaTeX parse error: Expected 'EOF', got '}' at position 40: …).val(cmark) }̲else{ conso…e.find(".Ctype textarea").val()
var ccontent = e . f i n d ( " . C c o n t e n t t e x t a r e a " ) . v a l ( ) v a r c m a r k = e.find(".Ccontent textarea").val() var cmark = e.find(".Ccontenttextarea").val()varcmark=e.find(".Cmark textarea").val()
$e.find(".Ctype").text(ctype)
$e.find(".Ccontent").text(ccontent)
$e.find(".Cmark").text(cmark)
}
}

function onblurshow(){
console.log(“onblue show”)
}

function closeModel(e){
if(e){editRow(e,isedit=false)}
var show =$(".model").css(“display”)
console.log(“click…”,show,e)
if(show==“block”){
$(".model").css({display:“none”})
}else{
$(".model").css({display:“block”})
}
}

function save(e){
editRow(e,isedit=false)
var that =e.parentNode.parentNode
var e = e= e=(that)
if(!isedit){
console.log($e.find(".Ctype"))
$e.find(".edit").css({display:“block”})
$e.find(".save").css({display:“none”})
}
}

function deleteRow(e){
console.log(e.parentNode.parentNode)
var that =e.parentNode.parentNode
that.parentNode.removeChild(that)
}

          <td class="Operations">
                    <a class="btn btn-primary btn-sm save" href="#"  onclick="save(this)">
                      <i class="fas fa-folder">
                      </i>
                      save
                  </a>
                  <a class="btn btn-info btn-sm edit"  href="#"  onclick="editRow(this,isedit=true)">
                      <i class="fas fa-pencil-alt">
                      </i>
                      Edit
                  </a>
                  <a class="btn btn-danger btn-sm" id="delete" href="#" onclick="deleteRow(this)">
                      <i class="fas fa-trash">
                      </i>
                      Delete
                  </a>
                  </td>
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值