为什么HTML复选框功能仅在IE中有效，而在Firefox或Chrome中不起作用？

Frank 发表于 Dev

坦率

我正在调试JavaScript / JSP / Struts应用程序，它具有一个复选框，可以进行高级搜索，如果选中该复选框，则应该在页面上显示其他2个项目供用户输入更多信息，但这仅在IE中有效，但不是Firefox或Chrome，在其他2个浏览器上进行检查时完全没有响应，为什么？以及如何使其在所有浏览器中都能正常工作？

在此处输入图片说明

<script type="text/javascript">
    function checkAdvSearch(checked) {      
        if(checked) {
            document.getElementById("searchTerm2").style.display = '';
            document.getElementById("searchField2").style.display = '';
        }else {
            document.getElementById("searchTerm2").style.display = 'none';
            document.getElementById("searchField2").style.display = 'none';
            document.getElementById("searchLOB").style.display = 'none';

            document.getElementById("searchTerm2").value = '';
            document.getElementById("searchField2").value = 'clientName';
            document.getElementById("searchStatus").value = '';
            document.getElementById("searchLOB").value = '';
        }
    }
</script>

...
<!-- for advanced search -->
  <td Valign=top width=300>
    <input type="checkbox" name="advSearch" onclick="checkAdvSearch(this.checked);" tabindex="5"/>Advanced Search
    <html:text property="searchTerm2" value="" style="display:none" tabindex="6"/>
  </td>
  <td Valign=top width=178>
    <html:select property="searchField2" onchange="showOptions2(this.form)" value= "" style="display:none" tabindex="7">
      <html:option value="clientName">Insured Name</html:option>
      <html:option value="policy">Policy Number</html:option>
        ...
    </html:select>
  </td>
...

坦率

经过一番研究，我找到了答案，在下面的问题中添加了“ styleId”：

<html:text property="searchTerm2" styleId="searchTerm2" value="" style="display:none" tabindex="6"/>

<html:select property="searchField2" styleId="searchField2" onchange="showOptions2(this.form)" value= "" style="display:none" tabindex="7">

处理后的styleId =“ xyz”将被转换为Id =“ xyz”，它将由document.getElementById（）标识，否则会因为其中没有ID而导致错误。

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。