首页 > 解决方案 > 另存为变量

问题描述

您好,我目前有一个脚本,您可以在其中将项目名称输入到输入中。以及它的尺寸、颜色和其他选项。这一切都保存为具有自定义规格的单个项目,例如:黑色 T 恤、大号、任何尺寸等。

我在表格底部有 3 个按钮,其中一个是输入,您可以在其中命名表格数据,然后按添加按钮并将此信息添加为变量,可以在另一个 html 文件中使用它来调用它。另一个是加载选择,您可以在其中加载和编辑它,类似于此 GitHub 文件在加载其计费信息时所具有的内容 ( https://github.com/hunterbdm/Deadass-Splash )

我还想不仅将整个内容保存为变量,而且还想以某种方式单独保存每一行,这样我以后可以在脚本的后端调用它,我的程序现在知道要搭配什么衬衫以及尺寸和颜色。

那么我将如何编写javascript(可以单独保存每一行的jQuery,以便稍后在后端调用它,可能类似于(variableName).line 1 = t-shirt black Large。

这是我的表的 html:

<div id="taskContainer">
  <table id="items-table">
    <!--<caption>Task</caption>-->
    <tr>
      <th>Item</th>
      <th>Size</th>
      <th colspan="3">Options</th>
    </tr>
    <tr>
      <td> </td>
    </tr>
  </table>
</div>
<label for="loadTask">Load Task:</label>
<label for="taskName">Task Name:</label>
<select id="loadTask"></select>
<input type="text" id="taskName"></input>
<button type="submit" id="addTask">Add</button>

我该怎么做呢?我是否需要标记每个以便我可以调用 [2] [2] 来调用具有特殊自定义的每一行?由于我是 Js 新手,并且对 python 更有经验,因此我的思维方式非常蟒蛇。

这是我的桌子的照片:

在此处输入图像描述

我会使用像 ipcRenderer 这样的东西吗?

这也是我的 JS 我将如何添加某种计数器,以便我可以设置具有该数字的行数:

function addRow() {
    var item_text = $('#item-input').val();
    var item_color = $('#color-input').val();
    var size_text = $('#sizes-item').val();
    var any_color = $('#any-color').is(':checked') ? 'Any Color' : '';
    var any_size = $('#any-size').is(':checked') ? 'Any Size' : '';
    $('#items-table').append('<tr>'
        +'<td>'+item_text+' '+item_color+'</td>'
        +'<td>'+size_text+'</td>'
        +'<td>'+any_color+' '+any_size+'</td>'
        +'<td><button class="remove-btn"><div class="thex">X</div></button><td>'
        +'</tr>');
} 

..

$(function(){
  $('#add-item').click(function(){
    addRow();
    return false;
  });
  $('body').on('click', '.remove-btn', function(){
    $(this).parent().parent().remove();
  });
});

标签: javascriptjqueryhtmlcssjquery-ui

解决方案


我试图用一个循环巧妙地做到这一点,但惨遭失败。无论如何,只要表中的行数不变,这将正常工作。

var table, cell1, cell2, cell3, cell4, cell5, cell6, cell7, cell8, cell9;
table = document.getElementById("items-table");

cell1 = table.rows[0].cells[0].innerHTML;
cell2 = table.rows[0].cells[1].innerHTML;
cell3 = table.rows[0].cells[2].innerHTML; // first row.

cell4 = table.rows[1].cells[0].innerHTML;
cell5 = table.rows[1].cells[1].innerHTML;
cell6 = table.rows[1].cells[2].innerHTML; // second row.

cell7 = table.rows[2].cells[0].innerHTML;
cell8 = table.rows[2].cells[1].innerHTML;
cell9 = table.rows[2].cells[2].innerHTML; // third row.

如果您想保存它并稍后在另一个文件(或同一个文件)中使用它,您可以通过 localStorage 轻松完成此操作。

localStorage.setItem("cell1", cell1); // where "cell1" is the name you want to save it as and cell1 is the variable.

稍后从另一个文件中调用它:

cell1 = localStorage.getItem("cell1");

推荐阅读