input输入框内容的显示和消失；导航栏对子栏的展现和隐藏

原创于 2015-08-04 08:55:23 发布 · 1.8k 阅读

1 ·

CC 4.0 BY-SA版权

js 同时被 2 个专栏收录

5 篇文章

订阅专栏

html

4 篇文章

订阅专栏

本文介绍了一种使用JavaScript实现网页中输入框内容显示与消失的方法，以及通过JavaScript控制导航栏子菜单的隐藏和展示的技术。对于输入框，通过onfocus和onblur事件触发器实现了默认提示文字的自动隐藏和显示；对于导航栏，则利用了一个简单的hiddenDiv函数来切换子菜单的可见状态。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

输入框内容的显示与消失：

<input type="text"  value="****" onfoucs="this.value=''" onblur="if(this.value='')this.value='****'">

导航栏对子栏的隐藏和展现

	<script type="text/javascript">
		function hiddenDiv(div){
			div.style.display=(div.style.display=='none'?'block':'none');
		}
	</script>



	<div class="h2">
		<div>
		<div class="h21"><a href="javascript:void(0)" onclick="hiddenDiv(document.getElementById('h22'))">业务中心</a></div>
		</div>
		<div id="h22" class="h22">
			<ul>
				<li><a href="">短信群发</a></li><br>
				<li><a href="">短信群发</a></li><br>
				<li><a href="">短信群发</a></li><br>
				<li><a href="">短信群发</a></li>
			</ul>
		</div>
	</div>