JS修改表格代码

Home / Article MrLee 2016-8-17 3522

常有html修改表单数据,这里给出一个jQuery修改td值的代码
function tdclick(tdobject){
        var td=$(tdobject);
        td.attr("onclick", "");
        //1,取出当前td中的文本内容保存起来
        var text=td.text();
        //2,清空td里面的内容
        td.html(""); //也可以用td.empty();
        //3,建立一个文本框,也就是input的元素节点
        var input=$("<input>");
        //4,设置文本框的值是保存起来的文本内容
        input.attr("value",text);
        input.bind("blur",function(){
            var inputnode=$(this);
            var inputtext=inputnode.val();
            var tdNode=inputnode.parent();
            tdNode.html(inputtext);
            tdNode.click(tdclick);
            td.attr("onclick", "tdclick(this)");
        });
        input.keyup(function(event){
            var myEvent =event||window.event;
            var kcode=myEvent.keyCode;
            if(kcode==13){
                var inputnode=$(this);
                var inputtext=inputnode.val();
                var tdNode=inputnode.parent();
                tdNode.html(inputtext);
                tdNode.click(tdclick);
            }
        });
        //5,将文本框加入到td中
        td.append(input);
        var t =input.val();
        input.val("").focus().val(t);
        //6,清除点击事件
        td.unbind("click");
    }

用法也相当简单,代码如下
<td ondblclick="tdclick(this)">{{item.id}}</td>

 

本文链接:https://it72.com:4443/9873.htm

推荐阅读
最新回复 (0)
返回