Question

我的代码从json生成一个html表。我控制了100％的代码。它可以是任何格式，限制最终代码在IE8中使用简单的jquery和javascript。我希望我的用户能够编辑表格中的数据。编辑AJAX后，将更改发送到服务器。我需要帮助找出如何从表格中获取数据。

我尝试过这些方法： 1.创建表时生成函数调用，然后单击要编辑的按钮。生成表时，基本上使用表数据创建填充函数调用。 2.我的第二种方法接近于1，但我试图通过在每个元素中“隐藏”数据来限制预先填充的函数调用中的参数数量。出于某种原因，只有在每个td元素中嵌入这样的东西时，我才能使它工作：

<td><input type="hidden" value="foo" id ="fooId"/>foo</td>

但这种方法基本上存储了两次数据。我可以像jquery一样提取数据：

document.getElementById(fooId).value

下面是一些示例代码，我试图说明我的两种方法，第三种，我想我希望它可以工作但不会。我的最终目标是第三行中的一个按钮，当单击该按钮时，它会合并列中其他行的数据。

有没有更简单的方法可以使用IE8？我真的不喜欢在我的代码中拥有所有这些隐藏的HTML，似乎有更好的方法。有什么建议吗？

谢谢，马特

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <title>Test</title>
    </head>

    <script>

        function functionCallAndTableGeneratedAtSameTime(row, col) {
            alert('Function call generated with table: row:'+row + ' col:' + col);
        }

        function functionExtractsDataFromHiddenInputElement(inId) {
            var myData ='Function call extracts data from hidden input element:' + document.getElementById(inId).value;
            alert(myData);
        }

        function viewContentsByTdId(inId) {
            var myNewTitle = document.getElementById(inId).value;
            alert(myNewTitle);
        }



    </script>
    <body>
        <h1 id="title">Extract Table Data</h1>
    <table border="1">
    <tr>
        <td>row 1, cell 1<input type="submit" id="byBtn11" value="FunctionCallAndTableGeneratedAtSameTime" onclick="functionCallAndTableGeneratedAtSameTime('1', '1')"/></td>
        <td>row 1, cell 2<input type="submit" id="byBtn12" value="FunctionCallAndTableGeneratedAtSameTime" onclick="functionCallAndTableGeneratedAtSameTime('1', '2')"/></td>
        <td><input type="submit" id="Submit5" value="Do Something With Combined Row1Col1 and Row1Col2 Data" onclick="functionCallAndTableGeneratedAtSameTime('col1', 'col2')"/></td>
    </tr>
    <tr>
<td><input type="hidden" value="row 1, cell 2" id ="r2c1"/>row 2, cell 1<input type="submit" id="Submit2" value="FunctionExtractsDataFromHiddenInputElement" onclick="functionExtractsDataFromHiddenInputElement('r2c1')"/></td>
<td><input type="hidden" value="row 1, cell 2" id ="r2c2"/>row 2, cell 2<input type="submit" id="Submit3" value="FunctionExtractsDataFromHiddenInputElement" onclick="functionExtractsDataFromHiddenInputElement('r2c2')"/></td>
<td><input type="submit" id="Submit6" value="Do Something With Combined Row1Col1 and Row1Col2 Data" onclick="functionExtractsDataFromHiddenInputElement('row2')"/></td>
    </tr>
<tr>
<td id="r3c1">row 3, cell 1<input type="submit" id="Submit1" value="ViewContentsByTdID (DoesNotWork)" onclick="viewContentsByTdId('r3c1')"/></td>
    <td id="r3c2">row 3, cell 2<input type="submit" id="Submit4" value="ViewContentsByTdID (DoesNotWork)" onclick="viewContentsByTdId('r3c1')"/></td>
    <td id="r3c3"><input type="submit" id="Submit7" value="Do Something With Combined Row3Col1 and Row3Col2 Data" onclick="viewContentsByTdId('r3')"/></td>
</tr>
</table>
</body>
</html>

使用javascript从HTML表中提取数据

0 个答案: