将纯文本更改为文本框后更新纯文本

时间:2011-11-28 19:04:12

标签: php jquery mysql ajax textbox

我有一些来自数据库的记录,这些记录显示在表行和列中。 我以纯文本显示此信息。但是我想在用户点击它们时将它们更改为文本框,并在光标模糊时更新内容。 我希望我可以给出我的意思。

有人帮助我吗?

3 个答案:

答案 0 :(得分:1)

答案 1 :(得分:0)

将表格单元格的内容转换为测试输入:

//bind event handler to click event for all table cells
$('td').on('click', function () {

    //cache this table cell in a variable
    var $table_cell = $(this);

    //add a text input with the text of this table cell,
    //then select that text input, focus it (so the user doesn't have to click on the text box to gain focus),
    //then add an event handler to the text input for the blur event
    $table_cell.html('<input type="text" value="' + $table_cell.text() + '" />').children('input').focus().bind('blur', function () {

        //run your code to update the text within this <td> element

        //sent a POST request to your server-side script with the value of the text-input
        $.post('path_to/server/script.php', $(this).serialize(), function (response) {

            //here you get the response from the server and you can update the table cell
            //if the response from the server is the new text for the cell then you can do this...
            $table_cell.text(response);
        });
    });
});

答案 2 :(得分:0)

如果您正在寻找内联编辑,可以使用大量插件。

这个看起来很有希望http://www.appelsiini.net/projects/jeditable(还没试过)