Question

我有以下代码，如果选中复选框（这可以正常工作），应首先更改文本，然后使用下拉框显示div。如果取消选中该复选框，则应该再次隐藏div。

问题是div包含一个javascript生成的下拉框，允许用户根据需要添加/删除字段。

如果您测试它，您会注意到当您选中复选框然后单击“添加国家/地区”时，再次取消选中该复选框，“添加国家/地区”将消失，但生成的下拉菜单不会消失。

如果再次取消选中复选框，有没有办法再次隐藏下拉菜单？

以下是代码：

Answer 1

您的浏览器会自动更正语法无效的html。您不能将div和图像放在表格中。您需要先放入行和单元格。然后该页面会中断，因为javascript并未定位您认为其定位的内容。

  <table cellpadding="0" cellspacing="0" id="tblCountryCurrency">
       <div id="detailedID" style="display: none;">
           <img src="http://placehold.it/30x30" title="Add Row" border="0" onclick="addRowToCountryPrice('',''); return false;">
       <a href="" onclick="addRowToCountryPrice('',''); return false;">Add a Country</a>
       <input type="hidden" name="TotalLinesCountry" id="TotalLinesCountry">

示例修复：

  <table cellpadding="0" cellspacing="0" id="tblCountryCurrency">
    <tr>
       <td><div id="detailedID" style="display: none;"></td>
    </tr>
  </table>

你可能根本不想在这里使用表格。所以我建议把它拉出来并用div替换它。那么你的代码可能会有效。

Answer 2

您的HTML无效。

<table>
   <div>
   ...
</table>

<table>单元格只能直接包含tr / tbody / thead标记。表中的一个裸div会从表中“泄漏”。

下面还有两个</table>结束标记，但只打开了一个<table>标记。

先修复你的html。清理它以使其更清晰 - 不要将脚本块填充到标记的中间。这令人困惑，难以阅读。

Answer 3

即使这是一团糟，也可以把你的

<div id="detailedID" style="display: none;">

在桌前。

javascript hide（）和show（）没有隐藏所有内容

3 个答案: