javascript怎样实现双击table的td实现编辑，并能保存到数据库？

javascript实现双击table的td实现编辑，并保存到数据库，需要执行以下 *** 作：

网页上，想输入文字，是需要文本框支持的。所以，想实现完美效果，建议td中加入2个元素：

<span></span>

<input type="text">

使用jquery绑定td的双击事件dblclick，事件效果：将span的文本赋值给input的value，隐藏span，显示input

使用jquery绑定input的焦点丢失事件blur，事件效果：将input的value赋值给span的文本，隐藏input，显示span

注意，table初始化的时候，span显示，input隐藏，并且span中的文本与input的value相同

你可以将这个表格的td这样设置下<td name = "TdName" >1</td>然后再将这个表格放在一个表单里,提交给一个servlet或是JSP页面再在servlet或JSP里来获得这个值,再将它存到数据库当然,首先你得要连接到数据

//这个正好手头正在做的一个项目中用到，提供思路，可以自由扩充

//在页面加载的时候注册一下 ，就是给要点击的地方添加事件或者是属性

//页面源码

<table>

    <tr>

        <td class="canChange">点击这里会出现文本框</td>

    </tr>

</table>

//JS

$(document).ready(function(){

    td_Click()

})

//点击事件

function td_Click() {

    $(".canChange").click(function () {

        var td = $(this)

        //所点文本框的id

        var id = $(this).attr("id")

        var txt = $.trim(td.text())

        

        var input = $("<input class=\"myinput\" id='new'  type='text'value='" + txt + "'style=\"width:80%heigth:100%\"/>")

        td.html(input)

        input.click(function () { return false })

        //获取焦点 

        input.trigger("focus")

        //文本框失去焦点后提交内容，重新变为文本 

        input.blur(function () {

            // var newtxt = $(this).val()

            var newtxt = $("#new").val()

            //判断文本有没有修改 

            if (newtxt != txt) {

                if (newtxt == null || newtxt == "") {

                    td.html(txt)

                }

                else {       

                    //表示已经修改

                    $.post(.......)//提交

                    td.html(newtxt)

                }

            }

            else {

                td.html(txt)

            }           

        })

    })

}

刷新页面可以通过 JQ的 Fresh方法来实现，

或者是是控件刷新来实现，

比如  $("#btnSearch").click()这样通过JQ调用按钮点击，实现重新读取数据

=================望采纳！

---