Question

以下代码设置表：

gridSetup: function () {
                var self = this;
                $table = $('#csTable');
                trows = $($table).find('tbody tr');

                //0. IMPORTANT - clear table rows before re-building the table
                trows.remove();

                for (var x = 0; x < self.acYearCount; x++) {
                    var ay = x + 1;
                    //1. create a new row for each academic year
                    $tr = $('<tr class="cost-schedule ay' + [x + 1] + '"/>');
                    //2. create a new header
                    $th = $('<th class="horizontal">' + ay + '</th>');
                    //3. append header to row and row to table
                    $($table).append($($tr).append($th));
                    //4. add cells to current academic year row
                    for (var y = 0; y < 4; y++) {
                        $td = $('<td align="center"><input class="vertical" size="6" value="0"/></td>');                           
                        $($tr).append($td);
                    }
                }
            },

按钮运行：

editMe: function(){
                $("#hideAll input").attr("disabled", false);
                $("#hideAll select").attr("disabled", false);

这些功能可在vue中找到。当我单击我的按钮时，我希望能够编辑创建的表。我试过在$ td = $（''）行中输入contenteditable =“false”;在editMe中使用（“td”）。attr（'contenteditable'，true）的网格设置。这些都不会使按钮单击时创建的表结构可编辑。上面editMe中找到的行使得创建的表上方的输入可编辑。感谢您的任何建议。

Answer 1

这里的许多变种在哪里：

How do I make a div element editable (like a textarea when I click it)?

另一个How to make an element's content editable with JavaScript (or jQuery)

来自jQuery论坛的参考：https://forum.jquery.com/topic/jquery-and-contenteditable - 他们认为一切都必须在你的样本中起作用......

无论如何，请在制作之前在浏览器中尝试使用控制台。

1）创建单个div #myid并尝试从console $（“＃myid”）。attr（“contenteditable”，true） - 它会好吗？ - 不 - 检查另一个浏览器 - 可能是它的实现 - 定义

2）用一个tr / td #myid创建一个简单的表，重复测试

3）尝试使用表tr + 2 td和$（'td'）选择器 - 它可以使单元格可编辑多个吗？

如果您确定这种方式有效并且TD变得可编辑 - 请返回您的工作代码并再次检查 - 您忘记了什么。

如何编辑html表中的内容

1 个答案: