有人可以解释为什么我的JavaScript无法正常工作吗？

Question

有人可以解释我在使用Javascript显示隐藏的DIV时出错的地方。 我已经看过以前的答案，但它们似乎没有起作用。

        .newinner
    {
        display: none;
        padding-left: 10px;
        padding-top: 10px;
        background: white;
        width: 905px;
        margin: auto;
        height: 400px;
    }
    </style>
    <script>
    function ShowDiv(newinner)
    {
        document.getElementsByClassName("newinner").style.display="block";
    }
    </script>

下面是DIV

    <button type="button" name="faddress" value="Show Div" onClick="showDiv('newinner')" />Find Address</button></div>
    <div class="newform">
    <div class="newinner">
    <form>
    <div class="formtitle"><b>To request this brochure please fill out the form below.</b></div>
    <div class="ntitle"><b>First Name*:</b><br><select>
      <option value="title">Title</option>
      <option value="mr">Mr</option>
      <option value="mrs">Mrs</option>
      <option value="miss">Miss</option>
      <option value="ms">Ms</option>
    </select>
    </div>
    <div class="fname">
    <input type="firstname" name="fname" /></div>
    <div class="lname"><b>Last Name:*</b><input type="lastname" name="lname" /></div>
    </form>
    </div>
    </div>

Answer 1

newinner被定义为一个类，你正在搜索id等于newinner的节点...而且你没有在你发布的代码中的任何地方调用ShowDiv（）

- 更新 -

自从我的初步回答以来，我看到你已经更新了问题，但代码中仍然存在一些问题。

document.getElementsByClassName返回给定类的所有元素; 它是一个类似阵列的结构。 所以通常你要遍历每个元素; 但在这种情况下，您可以使用id ，然后使用document.getElementById方法，该方法仅在找到时返回所选元素，否则返回null 。

所以你可以将showDiv重写为：

function ShowDiv (id) {
    document.getElementById(id).style.display = "block";
}

<button type="button" name="faddress" onClick="showDiv('newinner')">
    Find Address
</button>

<div id="newinner">
    ...
</div>

还要记住，使用onClick属性有利于快速原型设计或演示目的; 如果您要在生产中使用此代码，我建议您使用document.addEventListener 。

Answer 2

您没有在页面中的任何位置调用该功能

Answer 3

如果要使用document.getElementById（）方法，请为DIV提供ID。

只需将第2行从<div class="newinner">更改为<div class="newinner" id="newinner">