html div 组件隐藏,使用javascript显示隐藏html div

我想使用javascript自定义这个show hide html div.

HTML

Menu 1

Number 1

Number 2

Submit

Menu 2

Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting,

CSS代码

body {

font: 12px/16px sans-serif;

margin: 10px;

padding: 0;}

.clickme {

background-color: #eee;

border-radius: 4px;

color: #666;

display: block;

margin-bottom: 5px;

padding: 5px 10px;

text-decoration: none;}

.clickme:hover {

text-decoration: underline;}

.box {

background-color: #ccc;

border-radius: 4px;

color: #333;

margin: 5px 0;

padding: 5px 10px;

width: auto;}

Javascript代码

$('.box').hide();

// Make sure all the elements with a class of "clickme" are visible and bound

// with a click event to toggle the "box" state

$('.clickme').each(function() {

$(this).show(0).on('click', function(e) {

// This is only needed if your using an anchor to target the "box" elements

e.preventDefault();

// Find the next "box" element in the DOM

$(this).next('.box').slideToggle('fast');

});

});

当我单击Menu1行时,它会显示两个带有提交链接的文本列.

我想,当我点击提交按钮时,菜单1关闭和菜单2说明自动打开.我怎样才能做到这一点.请有人可以帮忙吗？

标签：jquery,javascript,css,html

来源： https://codeday.me/bug/20190714/1459013.html