单.js文件共享 它的数据与 2 个 HTML 页面调用

single .js file sharing it's data with 2 html page calls

本文关键字：HTML 调用 文件共享 js 数据      更新时间：2023-09-26

嗨，我有 2 个 html 页面在单个.js文件中使用函数。第二页需要访问在调用.js文件时首先由第一页初始化的数据：

 $(document).ready(function() 
{
var destinationTo = "";
var departingFrom = "";
var departing = "";
var returning = "";
var numAdults = "";
var numChildren = "";
var travelType = "";
$("#departing").datepicker();
$("#returning").datepicker();
$("#orderTickets").click(function() 
{
    destinationTo = $("#myDestination option:selected").text();
    departingFrom = $("#myDepart option:selected").text();
    departing = $("#departing").val();
    returning = $("#returning").val();
    numAdults = $("#adults option:selected").text();
    numChildren = $("#children option:selected").text();
    travelType = $("#class option:selected").text();
    var item = document.getElementById("hiddenListItem");
    if (departing === "" && returning === "")
    {
        alert("Please enter your travel dates.");
    }
    else if (item.style.display !== 'none' && returning === "")
    {
        alert("Please enter a return date.");
    }
    else if (departing === "") 
    {
        alert("Please enter a departing date.");
    } 
    else 
    {
        if (item.style.display !== 'list-item')
        {
            var isConfirmed = confirm("Please confirm your travel: outward journey from " + departingFrom + " on " + departing + " to " + destinationTo  + 
            " adults " + numAdults + " children " + numChildren + " travelling in " + travelType + " coach " + "?");
            if(isConfirmed == true)
            {
                window.location.href = 'PersonDetail.html';
            }
        }
        else
        {
            var isConfirmed = confirm("Please confirm your travel: outward journey from " + departingFrom + " on " + departing + " to " + destinationTo + " returning on " + 
            returning + " adults " + numAdults + " children " + numChildren + " travelling in " + travelType + " coach " + "?");
            if(isConfirmed == true)
            {
                window.location.href = 'PersonDetail.html';
            }
        }
    }
});
$("#startAgain").click(function()
{
    document.getElementById("travelDetailsForm").reset();
});
$("#finish").click(function() 
{
    var name = $("#name").val();
    var addy1 = $("#address1").val();
    var addy2 = $("#address2").val();
    var addy3 = $("#address3").val();
    var email = $("#email").val();
    var number = $("#number").val();
    travelType = $("#class option:selected").text();
    // test
    confirm("name " + name + " addy1 " + addy1 + " addy2 " + addy2 + " addy3 " + addy3 + " email " + email + " number " + number + " detion " + destinationTo);
});
});

我希望能够访问函数"#finish"中的函数调用"#orderTickets"中的数据，以向用户等支付订单。我以为我可以将变量放在全局位置，但认为当另一个页面访问.js文件时，它们会自行重置。

HTML和javascript不是我的事，希望得到一些帮助。

编辑：用户点击html页面1上的"订单票"，.js验证页面1，然后定向到html页面2，（相同的.js文件）验证页面2，并希望显示从页面1和2收集的数据。

当你说变量自行重置时，你是部分正确的。实际发生的是，每个页面都有自己的环境，因此上一页的变量甚至不再存在。每个页面都有自己的一组全新变量。

此外，您拥有的变量在页面中甚至不是全局的。它们存在于就绪事件处理程序的范围内。变量在就绪事件处理程序完成后完全存在的原因是它们在单击事件处理程序的闭包中被捕获。

若要将值从一个页面保留到下一个页面，必须将它们存储在页面本身之外。例如，您可以将值放在cookie中，然后可以在第二页中读取。

相关文章：