Javascript 带有jQuery的html表格可编辑和不可编辑单元格

是否有插件或方法使某些表列（非行）可编辑而其他列不可编辑 用jQuery

我见过一些插件，可以点击单元格使其可编辑，但我的意思是明确地使单元格/列可编辑或不可编辑。 我有办法做到这一点，但感觉有点像黑客的工作

下面是我的函数，用于使列可编辑：

function isEditable(rowArray, headersArray)
{
    var counter = 0;
    var notEditable = ['product code', 'product'];
    for(i in rowArray){
        counter = 0;
        data = headersArray[i].toLowerCase();
        for(a in notEditable){
            if(data == notEditable[a]){
                counter++;
            }
        }
        if(counter > 0){
            rowArray[i] += 'notEditable';
        }
    }
    return rowArray;
}

它将单元格的标题与预定义值数组进行比较，该数组=不可编辑的列

然后我构建行：

function buildHTMLTableRow(row, mutable)
{       
    output = '';
    output += '<tr>';
    for(var i = 0; i < row.length; i++)
    {
        value = trim(row[i]);
        if(mutable){
            index = value.indexOf('notEditable');
            if(index != -1){
                value = value.substring(0, index);
                output += '<td>' + value + '</td>';
            }
            else{
                output += '<td><input size="5" type="text" value="' + value + '" /></td>';
            }
        }
        else{
            output += '<td>' + value + '</td>';
        }
    }
    output += '</tr>';
    return output;
}

函数buildHTMLTableRow（行，可变）
{       
输出=''；
输出+=''；
对于（变量i=0；i

mutable

参数决定行是否可编辑，而

indexOf（'noteditable'）

通过

isEditable

函数决定单元格（但基本上是列）

---

是否有一个插件可以更好地实现这一点，或者我应该满足于我所拥有的？

访问此JSFIDLE链接：

以下是数据流：

我已经创建了一个名为“rowsD”的行数组。当页面加载时，我用这些行填充我的表（id=myData）

现在创建另一个名为disableHeaders的数组，我在其中传递头， 您需要禁用整个列

我正在调用函数disableFields作为参数传递disableHeaders

在函数中，我首先获取头的索引，其值等于头中的值

如果我找到一个，那么从Input标记中，我使用$（this.find（'Input'）选择器提取Value属性

最后，我用传递提取的输入标签值的标签替换当前子项

您还可以注释掉disableFields（disableHeaders）；行来实际查看表最初是如何呈现的

---

谢谢

是的，它可以工作，并且可能更易于重用，因为要禁用的头作为参数传递，与我的方法中一样硬编码到isEditable函数中。谢谢：）实际上刚刚发现在td上使用replaceWith（）会将其索引设置为-1，这很糟糕，因为我使用了索引值：(