JS获取文本框值拼接URL跳转时按钮点击不生效问题排查

安全阿岳

2026-8-29

问题根因

按钮点击无响应是两个代码错误导致的：

JS中使用document.getElementById()获取输入框，但三个输入框仅配置了name属性，没有设置对应id属性，获取到的元素为null，访问.value时直接抛出JS异常，后续跳转逻辑被中断
HTML存在无效冗余标签：输入框所在的<td>标签没有被<table><tr>包裹，还多写了一个无匹配开标签的</select>闭合标签，会导致DOM结构解析异常

修复后可运行代码

<h3>Enter Reference Number</h3>
<table>
  <tr>
    <td style="background-color:#f7faff;" width="300">
        <input name="txtBatchNo" id="txtBatchNo" type="text" size="2" maxlength="2">
        -
        <input name="txtSubDiv" id="txtSubDiv" type="text" size="5" maxlength="5">
        -
        <input name="txtRefNo" id="txtRefNo" type="text" size="8" maxlength="8">
    </td>
  </tr>
</table>

<input type="button" onclick="openPage()" value="Check BiLL">
<script type="text/javascript">
function openPage() {
    var add1 = document.getElementById('txtBatchNo').value.trim();
    var add2 = document.getElementById('txtSubDiv').value.trim();
    var add3 = document.getElementById('txtRefNo').value.trim();
    // 输入非空校验，可根据需求保留/删除
    if (!add1 || !add2 || !add3) {
        alert('请将参考编号填写完整');
        return;
    }
    var url = "http://www.lesco.gov.pk:36269/Default1.aspx?BatchNo=" + encodeURIComponent(add1) + "&SubDiv=" + encodeURIComponent(add2) + "&RefNo=" + encodeURIComponent(add3) + "&RU=U&Exec=941N7";
    window.open(url, "_blank");
}
</script>

可选优化说明