Question

我正在开发一个从数据库表中提取信息并将其放入HTML表格的网站。我正在使用Jquery点击功能，并且在单击时可以使表格单元格可编辑。我试图找出将编辑后的值推回数据库的最佳方法。数据库的每一行都有一个唯一的日期，所以我的想法是使用它作为搜索参数来查找正确的数据库条目，并与列号配对。我试图在满足后使用$(this).bind('input propertychange', function() {然后使用ajax，但被告知将函数放在函数内部是一个坏主意，所以我希望别人可以帮我提出一个更好的主意。这是一个表格的快速工作示例，可以节省一些时间，让任何人都可以使用代码来帮助我。感谢您提前帮助!!

＆＃13;

            $('td').click(function(){
                var val=($(this).siblings().first().text());
                var col = $(this).parent().children().index($(this));
                $(this).prop('contenteditable', true);
                //var row = $(this).parent().parent().children().index($(this).parent());
                //alert('Date: ' + val + ', Column: ' + col);
            });

＆＃13;

            table,th, td {
                border: 1px solid black;
                border-collapse: collapse;
                font-size: 90%;
            }
            th, td {
                padding:8px;
            }
            td {
                text-align: center;
            }
            table {
                margin:0 auto;
            }

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table><tr><th></th><th>22oz Dark</th><th>12ct 4oz Dark</th></tr><tr><th>2016-01-01</th><td>9785</td><td>2478</td></tr><tr><th>2016-01-02</th><td>8754</td><td>2136</td></tr><tr><th>2016-01-03</th><td>13587</td><td>2203</td></tr><tr><th>2016-01-04</th><td>14111</td><td>3297</td></tr><tr><th>2016-01-05</th><td>13212</td><td>3101</td></tr><tr><th>2016-01-06</th><td>16335</td><td>3299</td></tr><tr><th>2016-01-07</th><td>15421</td><td>3100</td></tr></table>

＆＃13;

Answer 1

在函数中放置函数通常在JavaScript中完成。回调函数和闭包就是这样。

我建议你在输入中添加一些类型的事件监听器，当它们完成编辑后你就可以获得该输入的值并进行AJAX调用。

因此，也许不要总是使输入可编辑，并在点击时添加该属性。你使用jQuery来定位它。

Answer 2

我想继续发布针对未来读者所面临的问题的解决方案。而不是尝试使用绑定我去了keyup（我一开始并不知道keyup ment key release）。因此，使用以下代码，我现在能够完成我在发布此问题时尝试做的事情：

$(this).keyup(function() {

                    //keyup means when a key is released

                    $.ajax({
                      method: "POST",
                      url: "updatedatabase.php",
                      data: { content: $(this).text() }
                    })
                      .done(function( msg ) {
                        alert( "Data Saved: " + msg );
                    });

                 });
            });

从HTML表中提取值以放入数据库

2 个答案: