2

我的代码从 json 生成一个 html 表。我控制 100% 的代码。它可以是任何格式，但最终代码使用简单的 jquery 和 javascript 在 IE8 中工作。我希望我的用户能够编辑表格中的数据。编辑后 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>
4

0 回答 0