如何更改不同页面上的元素答案

【问题标题】：How to change element on different page如何更改不同页面上的元素
【发布时间】：2021-07-27 05:56:53
【问题描述】：

我想将 index.html 页面上的表单用作“搜索”功能。从选择框中选择的选项将为第二页上显示的 div 提供搜索参数。

<button class=" col-6 btn btn-main" id="searchButton" type="submit" onclick="findHotel();" style="background-color: #ee580f;" class="form-control">Search</button>

<form id="tourForm" class="main-form tour-form" action="">

到目前为止，提交按钮的 onclick() 函数将表单的操作更改为所需的 url。

我想隐藏第二页上所有不符合搜索条件的 div。这类似于过滤器，但参数将从第一页中选择，并应用于第二页。该函数将隐藏所有 div 元素并仅显示与所选选项匹配的 div。

function findHotel() {
    var tourType = document.getElementById("hotelLocation").value;

    switch (tourType) {
        case "Chicago, USA":
            document.getElementById("hotelForm").action = "html/book.html";
            document.getElementsByClassName("hotel-option").style.display = none;
            document.getElementById("chicagoHotel").style.display = block;
            break;

        case "Singapore":
            document.getElementById("hotelForm").action = "html/book.html";
            document.getElementsByClassName("hotel-option").hide;
            document.getElementById("singaporeHotel").
            break;

        default:
            document.getElementById("tourForm").action = "html/book.html";
            break;
    }
}

在尝试了多种方法后，看来我需要使用本地存储或 cookie 来执行此操作。有什么想法吗？

【问题讨论】：

也可以使用网址
您想以 GET 形式提交表单，然后从其他页面上的 url 读取数据。然后根据您从 url 读取的内容在其他页面上进行显示更改
我认为您可以使用一些 JSON 对象来存储当前的服务器和信息，这样您就可以将信息保持在当前状态。

标签： javascript html cookies filter local-storage

【解决方案1】：

为了将值从一个页面传递到另一个页面。如果你有后端服务器，可以使用 POST 请求。

如果您没有要支持的后端服务器，那么您唯一的方法就是使用 GETrequest 或仅使用本地 Cookie。

【讨论】：