Question

我不知道如何在jQuery中获取所选的行详细信息。例如，我在表格中选择前两行。

我想提交到下一页，第二页可以显示所选的两行。

这是我的第二页的编码。

$(document).ready(function () {
  $('#card-type').html(simpleStorage.get('cardType'));
//my code stuck here.

任何人都可以给我一些想法？

Answer 1

正如@krushna所说，你可以尝试使用localStorage。

我之前从未使用它，但我想尝试满足您的需求。

这是我的解决方案，当然，你可以改进它，我只提供一种方法来解决你的问题。以下代码适合您的需要：

首先，我的页面 p1.html

html： 我只是尝试从你的照片中复制你的HTML。

  <body>
    <table>
      <tr>
        <th>Primary</th>
        <th>Tag/untag</th>
        <th>Account</th>
      </tr>
      <tr>
        <td><input type="radio" class="primary" name="rd_prim" id="rd_prim1" ></td>
        <td><input type="checkbox" class="tag" id="check_1"></td>
        <td><span class="account" id="acc1">123456789</span></td>
      </tr>
      <tr>
        <td><input type="radio" class="primary" name="rd_prim" id="rd_prim2" ></td>
        <td><input type="checkbox" class="tag" id="check_2" ></td>
         <td><span class="account" id="acc2">987654321</span></td>
      </tr>
    </table>
    <input type="button" value="submit" id="smt">
  </body>

Jquery：

    $(document).ready(function() {
      localStorage.clear();
      $("#smt").click(function() {
        var data_length = $('table').find("tr").not(":first").length-1;
        var i = 0;
        localStorage.setItem("data_length", data_length);
        $.each($('table').find("tr").not(":first"), function() {
            $.each($(this).find("td"),function() {
                if ($(this).children().is("span")) {
                  localStorage.setItem($(this).children().attr("class")+""+i,  $(this).children().text());
                } else {
                  localStorage.setItem($(this).children().attr("class")+""+i,  $(this).children().is(":checked"));
                }
            })      
        i++;
        })
        window.location = "p2.html";
      })
    })

现在是第二页： p2.html 已修改

html：

<body>
    <div id="result">
        <table>
            <tr>
                <th>Primary</th>
                <th>Accounts</th>
            </tr>

        </table>
    </div>
</body>

JQuery：

  $(document).ready(function() {
        var data_length = localStorage.getItem("data_length");
        for (var i = 0; i <= data_length; i++) {
            var primary = localStorage.getItem("primary"+i) == "true"?"checked":"";
            var tag = localStorage.getItem("tag"+i) == "true" ?"true":"false";
            var account = localStorage.getItem("account"+i);
            if (tag != "true" ) {
                continue;
            }
            $("table").append("<tr><td><input type='radio' name='rd_prim' "+primary+"></td><td><span class='account'>"+account+"</span></td></tr>");
        }
  })

希望这会有所帮助。

如何在Jquery中获取选定的行详细信息

1 个答案: