javascript - 从表内的文本框读取数据

标签 javascript html local-storage

我的代码中有以下两个函数,addValueToStorage 必须读取可编辑表数据并将值添加到 localStorage,填充表从 localStorage 读取值并使用更新的值填充表并创建表不可编辑。

function addValueToStorage() {
    localStorage.clear();
    var table = document.getElementById('table');
    var i;
    var j;
    var rowLength = table.rows.length;
    for (i = 0; i < rowLength; i++) {
        var value=[];
        for (j = 0; j < 4; j++) {
            value.push(table.rows[i].cells[j].firstChild.data);
        }
        var val=JSON.stringify(value);
        var key = "xyz" + localStorage.length;
        localStorage.setItem(key, val);
    }
    populatetable();
}

function populatetable() {
    $('#table').empty();
    var header = "<tr><th>Select</th><th>Name</th><th>1</th><th>2</th><th>3</th></tr>";
    $('#table').append(header);
    for (var i = 0; i < localStorage.length; i++) {
        var key = localStorage.key(i);
        if (key.substring(0, 5) == "xyz") {
            var value = JSON.parse(localStorage.getItem(key));
            var xyzvalue = "<tr><td><input type=\"checkbox\" value=" + key + "></td><td><input type=\"text\"  value=" + value[0] + "></td><td><input type=\"text\"  value=" + value[1] + "</td><td><input type=\"text\"  value=" + value[2] + "</td><td><input type=\"text\"  value=" + value[3] + "</td></tr>";
            $('#table').append(xyzvalue);
        }
    }
    $('#table:input').prop("disabled", true);
}

addValueToStorage 能够从普通表格的单元格中读取数据,但由于我的表格是可编辑的,我在表格内使用了文本框,并且 addValueToStorage 无法从单元格中读取数据,而且表格大小为由于文本框的原因,它完全扭曲并溢出了包围它的 div。 非常感谢任何有关提取数据和设置表大小的帮助。提前致谢

最佳答案

尝试改变:

for (i = 0; i < rowLength; i++) {
    var value=[];
    for (j = 0; j < 4; j++) {
        value.push(table.rows[i].cells[j].firstChild.data);
    }
    var val=JSON.stringify(value);
    var key = "xyz" + localStorage.length;
    localStorage.setItem(key, val);
}

for (i = 0; i < rowLength; i++) {
    var value=[];
    for (j = 0; j < 4; j++) {
        // getAttribute is probably what you're after here
        value.push(table.rows[i].cells[j].firstChild.getAttribute('value'));
    }
    var val=JSON.stringify(value);
    var key = "xyz" + localStorage.length;
    localStorage.setItem(key, val);
}

关于javascript - 从表内的文本框读取数据,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18236292/

相关文章:

javascript - 如何以编程方式滚动位于 flex box div 内的 D3 SVG 树?

javascript - 跳转到 Bootstrap 轮播上的最后一张幻灯片

javascript - 我们应该继续在 AngularJS 中使用表单吗?

backbone.js - 在 Backbone.js 中使用 localStorage

javascript - 正则表达式到坐标WGS84?

php - 解决php登录错误的方法

html - 用户应该如何在 asp.net 2.0 中从我的网站向我发送邮件

javascript - JSON.parse localStorage 输入错误意外结束

javascript - localStorage.setItem 不能存储 html 的字符串

javascript - 删除 td 中的边框(更多!)