console 命令行工具 X clear

console

 spans=document.getElementsByTagName("span");
    for(i=0;i<spans.length;i++)
    {if(spans[i].className=="label")
    {  spans[i].onclick=function()
    {    document.getElementById('textbox').value=this.innerHTML;
    }}}
    function xiugai(a) {
        var trobj = a.parentNode.parentNode; //获得按钮所在行的行对象
        var tdobj = trobj.getElementsByTagName("span");
        for (var i = 0; i < tdobj.length - 1; i++) {
            //循环把每一个单元格变成input类型
            tdobj[i].innerHTML = "<input class='ipt' onblur='submit(this)' type=\"input\" value='" + tdobj[i].innerText + " '/>";
        }
    }
    function submit(inputobj) {
        $.ajax(
            {
                url: "Add",
                type: "post",
                datatype: "json",
                success: function (result) { //返回的结果自动放在resut里面了
                    if (result != null) {
                        inputobj.parentNode.innerText = inputobj.value;//去掉输入框并赋值给单元格
                    }
                }
            });
    }

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="input.css">
    <script src="https://lib.sinaapp.com/js/jquery/2.0.2/jquery-2.0.2.min.js"></script>
</head>
<body>
<div class="main">
    <div class="main-center">
        <div class="main-center-title">
            审批意见（同意）
            <div class="main-center-button">
                取消
            </div>
        </div>
        <div class="main-center-input">
            <input  id="textbox" size = "30" type="text"placeholder="请输入审批意见">
        </div>
        <div class="main-center-text">
            快捷标签
            <div class="main-center-p" onclick="xiugai(this)">
                编辑
            </div>
        </div>
        <div class="main-bottom-div">
        <div class="main-center-div">
            <span class="label">好的。可以</span>
        </div>
        <div class="main-center-div div-w">
            <span class="label"> 把工作内容和组长报告下</span>
        </div>
        <div class="main-center-div">
           <span class="label"> 路上小心</span>
        </div>
        </div>
    </div>
</div>
</body>
</html>

body {
  background: #9d9d9d;
}
.main-center {
  width: 400px;
  height: 300px;
  background: white;
  margin: auto;
  border-radius: 10px;
  padding: 10px;
}
.main-center .main-center-title {
  float: left;
}
.main-center .main-center-button {
  width: 80px;
  height: 20px;
  border: 1px solid #000000;
  border-radius: 30px;
  text-align: center;
  line-height: 20px;
  float: right;
  margin-left: 11rem;
  margin-bottom: 20px;
}
.main-center .main-center-input {
  width: 97%;
  height: 90px;
  padding-top: 20px;
  border-radius: 10px;
  border: none;
  background: #f5f5f5;
  clear: both;
}
.main-center input {
  border: none;
  background: #f5f5f5;
  width: 100%;
}
.main-center .main-center-text {
  color: #9d9d9d;
  float: left;
}
.main-center .main-center-p {
  float: right;
  color: black;
  margin-left: 17rem;
}
.main-center .main-center-div {
  width: 100px;
  height: 20px;
  border-radius: 5px;
  text-align: center;
  line-height: 20px;
  float: left;
  border: 1px solid #9d9d9d;
  margin-top: 20px;
  padding: 2px;
}
.main-center .div-w {
  width: 200px;
  float: left;
  margin-left: 5rem;
}
.main-center .main-bottom-div {
  clear: both;
}
.active {
  background: yellow;
  border: none!important;
}