JavaScript：从文本框获取输入并打开新标签页进行搜索

<div id="company-search-field">
  <input id="company-name" name="company-name" placeholder="Insert company name here" />
</div>

const companyNameInput = document.getElementById('company-name');

// 错误示例：在脚本加载时读取，值通常为空
// const companySearchValue = document.getElementById('company-name').value;

// 正确示例：在函数被调用时（例如点击按钮时）读取
function performSearch() {
  const companySearchValue = document.getElementById('company-name').value;
  // ... 使用 companySearchValue 进行后续操作
}

const searchTerm = "Exxon Mobil";
const encodedSearchTerm = encodeURIComponent(searchTerm); // 结果: "Exxon%20Mobil"
const searchUrl = `https://example.com/search?q=${encodedSearchTerm}`;
// searchUrl 将是 "https://example.com/search?q=Exxon%20Mobil"

const searchTerm = "Exxon Mobil";
const encodedSearchTerm = encodeURIComponent(searchTerm);
const searchUrl = `https://beta.canadasbusinessregistries.ca/search/results?search=%7B${encodedSearchTerm}%7D&status=Active`;
// searchUrl 将是 "https://beta.canadasbusinessregistries.ca/search/results?search=%7BExxon%20Mobil%7D&status=Active"

window.open(searchUrl, '_blank'); // '_blank' 参数表示在新标签页/窗口打开

<!-- HTML 结构相关部分 -->
<div id="company-search-field">
  <input id="company-name" name="company-name" style="background-color: white; margin-left: 1rem; width: 300px; line-height: 5;" placeholder="Insert company name here" />
</div>
<!-- ... 其他 HTML ... -->
<button style="..." onclick="openCorporateRecordTabs();">
    Search Corporate Records
</button>

// 定义一个包含搜索URL模板的对象
// 为了演示动态URL构建，我们将alberta条目定义为一个函数，它接收搜索词并返回完整的URL数组。
// 其他不依赖搜索词的URL保持为字符串数组。
const corporaterecordsUrls = {
  "federal-level": ["https://www.ic.gc.ca/app/scr/cc/CorporationsCanada/fdrlCrpSrch.html?locale=en_CA"],
  "alberta": (searchTerm) => {
    // 确保搜索词经过URL编码，并按照目标网站的格式包裹在 %7B 和 %7D 中
    const encodedSearchTerm = encodeURIComponent(searchTerm);
    return [`https://beta.canadasbusinessregistries.ca/search/results?search=%7B${encodedSearchTerm}%7D&status=Active`];
  },
  "british-columbia": ["https://beta.canadasbusinessregistries.ca/search", "https://www.bccourts.ca/search_judgments.aspx", "https://www.provincialcourt.bc.ca/judgments.php?link=https://www.canlii.org/en/bc/bcpc/"],
  // ... 其他省份的URL，根据是否需要搜索词来决定是数组还是函数
  // 假设这里只展示需要动态搜索词的“alberta”
};

// 修正后的 openCorporateRecordTabs 函数
const openCorporateRecordTabs = () => {
  // 1. 在函数执行时（点击按钮时）获取输入框的值
  const companySearchInput = document.getElementById('company-name');
  const companySearchValue = companySearchInput ? companySearchInput.value.trim() : ''; // 获取值并去除首尾空格

  // 检查输入是否为空
  if (!companySearchValue) {
    alert("请输入公司名称进行搜索。");
    return; // 如果输入为空，则不执行搜索
  }

  // 2. 获取当前选中的州名
  const selectedStateRadio = document.querySelector('input[name="state-name"]:checked');
  if (!selectedStateRadio) {
    alert("请选择一个州进行搜索。");
    return;
  }
  const selectedStateName = selectedStateRadio.value;

  let urlsToOpen = [];
  const stateUrlsEntry = corporaterecordsUrls[selectedStateName];

  // 3. 根据 URL 模板的类型（函数或数组）动态生成 URL
  if (typeof stateUrlsEntry === 'function') {
    // 如果是函数，则传入搜索词来生成 URL
    urlsToOpen = stateUrlsEntry(companySearchValue);
  } else if (Array.isArray(stateUrlsEntry)) {
    // 如果是数组，则直接使用预定义的 URL
    urlsToOpen = stateUrlsEntry;
  } else {
    console.error("未知的州 URL 配置类型:", selectedStateName);
    return;
  }

  // 4. 遍历并打开所有相关 URL
  urlsToOpen.forEach(url => {
    window.open(url, '_blank');
  });
};

// 原始代码中的 displayPersonOrCompanySearchFields 函数保持不变
function displayPersonOrCompanySearchFields() {
  let person = document.getElementById("person-subject");
  let company = document.getElementById("company-subject");
  let person_states = document.getElementById("person-search-states");
  let company_states = document.getElementById("company-search-states");
  let person_field = document.getElementById("person-search-field");
  let company_field = document.getElementById("company-search-field");

  if (person.checked === true) {
    person_states.style.display = "block";
    person_field.style.display = "block";
    company_states.style.display = "none";
    company_field.style.display = "none";
  } else {
    company_states.style.display = "block";
    company_field.style.display = "block";
    person_states.style.display = "none";
    person_field.style.display = "none";
  }
}

// 注意：openSelectedStateTabs 函数在原代码中未定义，如果需要，也应类似处理
// const openSelectedStateTabs = () => { /* 实现逻辑 */ };