如何使用一个搜索栏应用多个过滤器，并在搜索栏中显示这些过滤器？

<input type="text" id="searchInput" placeholder="请输入搜索关键字">

<select id="regionFilter">
  <option value="">全部地区</option>
  <option value="Asia">亚洲</option>
  <option value="Europe">欧洲</option>
  <option value="North America">北美洲</option>
  <!-- 其他选项 -->
</select>

const searchInput = document.getElementById('searchInput');
const regionFilter = document.getElementById('regionFilter');

searchInput.addEventListener('input', handleSearch);
regionFilter.addEventListener('change', handleSearch);

function handleSearch() {
  const keyword = searchInput.value;
  const region = regionFilter.value;

  // 根据关键字和过滤器的值进行搜索和过滤操作
  // 可以使用AJAX请求后端接口获取搜索结果，并更新页面显示
  // 或者在前端使用JavaScript过滤已有数据并更新页面显示
}

function handleSearch() {
  const keyword = searchInput.value;
  const region = regionFilter.value;

  // 更新搜索栏显示内容
  const filterText = region ? `地区：${region}` : '';
  searchInput.placeholder = `请输入搜索关键字 (${filterText})`;

  // 进行搜索和过滤操作
  // ...
}