时区API搜索功能异常求助：查询参数无法正常传递

核心问题点 #

• 按钮事件绑定错误：按钮的onClick调用的是getTimezone()，没有传递搜索框输入值；且页面初始化时自动执行了一次getTimezone()，此时searchQuery为undefined，导致API请求使用默认值。
• 定义的searchlocation函数未被使用：这个函数原本是用来获取搜索框值并传递给getTimezone的，但没有绑定到按钮点击事件，完全没发挥作用。

修复步骤 #

1. 修正按钮点击事件
   将按钮的onClick属性改为调用searchlocation()，确保点击按钮时能获取并传递搜索框的输入值：

   <button type="button" onClick="searchlocation()">Search</button>
   

2. 移除不必要的初始化请求
   页面加载时自动调用getTimezone()会触发一次无参数的无效请求，除非你需要默认加载某个位置，否则删除这行代码：

   $(document).ready(function() {
     // 移除 getTimezone(); 这一行
   })
   

3. 添加参数校验与编码（可选但推荐）
   在getTimezone函数里添加空值判断，避免无效请求；同时用encodeURIComponent()处理搜索参数，防止特殊字符导致请求出错：

   async function getTimezone(searchQuery) {
     if (!searchQuery || searchQuery.trim() === '') {
       $('.error-message').text('请输入有效地理位置');
       return;
     }
     var url = "https://timezone.abstractapi.com/v1/current_time/?api_key=[REDACTED]&location=" + encodeURIComponent(searchQuery);
     $.ajax(url, {
       success: function(data) {
         console.log(data);
         $('.error-message').text(''); // 清空错误提示
       },
       error: function() {
         $('.error-message').text('获取时区信息失败');
       }
     })
   }
   

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