Question

我正在尝试创建一个小型html项目，人们可以通过选择电影和座位来预订电影院，然后通过点击PAY按钮显示一个新页面，总结他们的预订，一旦SAVE按钮是点击后，他们的预订应显示为预订表中的新行。

因此，只要在上一页中单击按钮（实际上是指向新页面的链接），我就很难在表格页面中添加新行。

这是我的订单页面的表格部分（当然嵌套在div体内）：

<table style="border:1px solid black; width:1000px;" id="table">
     <tr bgcolor=#262673 id="tr1" >
          <td align=center style="color:white; font-size:30px;"><b>Movie Name</b>  </td>  
          <td align=center style="color:white; font-size:30px"><b>Number Of Seats</b>  </td>  
          <td align=center style="color:white; font-size:30px"><b>Credit Card Type </b></td>  
    </tr> 
 </table>

以下是上一页名为“pay”的链接：

<a href='myorders.html' onclick="Save();" id="link" ><img src='sobutton.png' height=40 align="right" ></a>

这是我的jquery.js文件，链接到订单页面：

if (typeof (Storage) !== "undefined") {
$(document).ready(function () {

    var prev = sessionStorage.getItem("toBeAppended"); // if nothing to append (if it's first time) then prev = null
    if (prev == null)
        prev = " "; // if prev == null, assign to it: " " (space) value
    var numOfSeats = JSON.parse(sessionStorage.getItem('checked')).length;
    var card = sessionStorage.getItem("CardName");
    var movie = sessionStorage.getItem("moviename");
    var new1 = "<tr><td>" + movie + "</td><td>" + numOfSeats + "</td><td>" + card + "</td></tr>";
    var oldPlusNew = prev+new1;
    $("#table").addClass("TABLE");
    $("#table").append(oldPlusNew);
    sessionStorage.setItem("toBeAppended", oldPlusNew);
});
}

请忽略sessionstorage部分。问题是每当“付费”页面被加载时，一行被添加到订单页面，并且当订单页面被加载时，同样的事情发生，所以当我点击按钮SAVE从付款页面移动到订单页面时我看到同一行两次，而不是只有一次......我不知道为什么会这样，所以如果有人愿意帮助我，我会很感激。

P.S jQuery文件只链接到订单页面而不是付费页面

此外，人们有机会从复选框中选择信用卡类型，而我似乎无法检索所选选项的值。

Answer 1

回答您的第二个问题：

<select id="mySelect">
                <option value="AmericanExpress">American Express</option>
                <option value="Discover">Discover</option>
                <option value="Visa">Visa</option>
            </select>

将所选选项设置为sessionStorage：

sessionStorage.setItem("CardName", document.getElementById("mySelect").value);

要在另一页上获取该值：

var card = sessionStorage.getItem("CardName");

在页面之间移动时向表中添加新行

1 个答案: