实现鼠标双击表格时,文本框变成输入框进行编辑


      editEvent: function(event,index){
        let dom = event.target; //获取当前节点元素
        let oldVal = dom.innerHTML;//获取当前值
        dom.innerHTML ="";//
        let inputHtml = document.createElement("input");//创建input标签
        inputHtml.setAttribute("type","text");
        inputHtml.setAttribute("value",oldVal);
        inputHtml.style.height="100%";
        inputHtml.style.width ="100%";
        dom.appendChild(inputHtml);
        inputHtml.focus();//使光标在输入框内
        inputHtml.select();//默认选择内容
        inputHtml.onblur = function(e){
      //绑定失去焦点事件
          let target = e.target;
          console.log("index: " + index)
          let newVal = target.value;
          console.log(newVal);
          dom.innerHTML = newVal;
        }
      }

该方法只是简单的功能实现,没有做非空判断以及代码优化
原文地址:https://www.cnblogs.com/zhangxiaoshu/p/6590425.html