如何保留URL关键词参数？房产搜索排序页参数丢失问题

要保留URL中的keyword参数，你需要把当前页面URL里的keyword值填充到隐藏字段中，这样提交表单时会同时携带keyword和orderby两个参数，不会丢失搜索条件。下面是两种常见实现方式：

后端渲染场景（如PHP/WordPress） #

如果你的页面是后端生成的，直接从URL参数中获取keyword值，填充到隐藏字段即可：

通用PHP写法 #

<form class="propertyhive-ordering" method="get">
    <!-- 新增隐藏字段 -->
    <input type="hidden" name="keyword" value="<?php echo htmlspecialchars($_GET['keyword'] ?? ''); ?>">
    <select name="orderby" class="orderby">
        <option value="floor_area-desc">Sort by floor area: high to low</option>
        <option value="floor_area-asc">Sort by floor area: low to high</option>
    </select>
</form>

htmlspecialchars用来转义特殊字符，避免XSS漏洞和参数解析错误。

WordPress（PropertyHive插件场景） #

如果你用的是WordPress的PropertyHive插件，可以用官方的查询变量方法：

<form class="propertyhive-ordering" method="get">
    <input type="hidden" name="keyword" value="<?php echo esc_attr(get_query_var('keyword')); ?>">
    <select name="orderby" class="orderby">
        <option value="floor_area-desc">Sort by floor area: high to low</option>
        <option value="floor_area-asc">Sort by floor area: low to high</option>
    </select>
</form>

前端JavaScript实现 #

如果是纯前端页面，用JS读取URL中的keyword参数，再设置到隐藏字段：

<form class="propertyhive-ordering" method="get">
    <input type="hidden" name="keyword" id="keyword-hidden">
    <select name="orderby" class="orderby">
        <option value="floor_area-desc">Sort by floor area: high to low</option>
        <option value="floor_area-asc">Sort by floor area: low to high</option>
    </select>
</form>

<script>
// 解析当前URL的查询参数
const urlParams = new URLSearchParams(window.location.search);
const keyword = urlParams.get('keyword');
// 如果存在keyword参数，设置到隐藏字段
if (keyword) {
    document.getElementById('keyword-hidden').value = keyword;
}
</script>

这样提交表单后，URL会变成/search-results/?keyword="glasgow"&orderby=floor_area-desc，既能保留搜索关键词，又能应用排序规则。

内容的提问来源于stack exchange，提问作者CNK