当选中复选框时，尝试使用JavaScript（无jQuery）在html中显示div（2个类）

基本上我有一个表单，它有两个不同的扩展，这取决于选择了单日还是多日旅行（还没有编码，一旦我完成了这项工作，我可以正确地进行分类）。我看了很多类似的问题，但不幸的是，其中很多都使用jQuery

我已经做了两天了，谷歌搜索了一下，看了这里，按照我导师的建议走了这么远，但它还没有完全实现，我还没有足够的理解来修复它。我希望这是一件简单的事情，我只是在这一点上有点太没有经验，认识不到这一点

现在，我正试图制作一个div，根据单击的类别，显示两个不同的类。目前，硬编码到函数中的类并不重要。最终，我希望在单击submit按钮时显示div（仍然取决于选中的复选框），但这可能是未来的努力（假设只是一些if/else语句）

如果有人能帮我，或者只是给我指出正确的方向（请记住，我大约3周前开始学习这个，在过去的2周里甚至没有使用过它），我将非常感谢你的帮助

我附上了一段当前代码，以及photoshop最终结果的图片（在选中复选框之前，水平白线下方的所有内容最初都将隐藏）

首先，在“框架和扩展”下，将选择框设置为“无包装体”，而不是“加载”（在左上角）

其次，您有多个语法错误

Multi day<input type="checkbox" name="multi-day"         value="multi-day" onclick=""ShowExtraForm1('multiBooking')"">

在“style”属性之前添加一个。它当前是一个语法错误

---

还有，您试图隐藏的实际表单在哪里？

很抱歉，忘记了您应该在问题中添加代码的JSFiddle链接，以及JSFiddle。只需编辑您的问题并添加它。我已经尝试了几次，但它没有显示出来，对它的工作原理不太熟悉，我现在将更改onload问题，尽管[JSFiddle]谢谢@jbarnett，我不知道那个区域是关于什么的，也从来没有注意到额外的“。我还没有做额外的表单区域，只有顶部部分。我只是有两个彩色的DIV，以便首先了解JavaScript部分的一般概念。

I have edited your jsfiddle link

think its not working there but this is the function you want

function ShowExtraForm1() 
    {
        var singlechecksts;
        var multichecksts;
        singlechecksts= document.getElementById('singlecheck');
        multichecksts= document.getElementById('multicheck');

        if(singlechecksts.checked)
        {
        document.getElementById('singleBooking').style.display="block";
        document.getElementById('multiBooking').style.display="none";
        }

        if(multichecksts.checked)
        {
        document.getElementById('singleBooking').style.display="block";
        document.getElementById('multiBooking').style.display="block";
        }
    }

where singlecheck and multicheck are id's of your checkboxs

I have edited your jsfiddle link

think its not working there but this is the function you want

function ShowExtraForm1() 
    {
        var singlechecksts;
        var multichecksts;
        singlechecksts= document.getElementById('singlecheck');
        multichecksts= document.getElementById('multicheck');

        if(singlechecksts.checked)
        {
        document.getElementById('singleBooking').style.display="block";
        document.getElementById('multiBooking').style.display="none";
        }

        if(multichecksts.checked)
        {
        document.getElementById('singleBooking').style.display="block";
        document.getElementById('multiBooking').style.display="block";
        }
    }

where singlecheck and multicheck are id's of your checkboxs