sessionStorage会话存储

页面使用datatables时需要使用jquery.data()在每一行的某个元素中保存一整行的数据，以便随时随地调用准确的行信息，避免了使用td:eq(0)获取元素在改变列下标情况下出现数据获取偏移的问题（比如使用td:eq(5)获取值，当把下标5的列挪到第3列时就得同步更改成td:eq(2)）：

"render" : function(data, type, row, meta) {
    var html = "";
    html += "<div><img src=\"images/empty-checkbox.png\" name=\""+row.itemid+"\" class=\"checkBoxImg\"/></div>";
    $("[name='"+row.itemid+"']").data("ItemInfo");
    return html;
}

$("#table tbody tr").each(function(){
    $(this).find(".checkBoxImg").data("ItemInfo");
})
复制代码

通过这种办法可以获取到datatable渲染每行时为img元素设置的data缓存数据。但实际使用中出现以下bug：当调用table.draw(false)重新加载表格后，无法获取img的data缓存值，原因未知。此外render方法在每次加载表格时都要被调用两次，一直找不到原因。

无法直接解决问题就只好找变通方法，发现sessionStorage会话存储比较适合目前的情况，以下是更新后的代码：

"render" : function(data, type, row, meta) {
    var html = "";
    html += "<div><img src=\"images/empty-checkbox.png\" name=\""+row.itemid+"\" class=\"checkBoxImg\"/></div>";
    window.sessionStorage.setItem("ItemID_" + row.itemid, JSON.stringify(row));
    return html;
}

$("#table tbody tr").each(function(){
    var itemInfo = JSON.parse(window.sessionStorage.getItem("ItemID_" + checkBox.attr("name")))
})
复制代码

转载于:https://juejin.im/post/5caf11f26fb9a0688539a89e