html页面,左边点击链接,右边显示内容参考代码。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Untitled Document</title>
<script type="text/javascript">
function funcShow(id){
for(var i=0;i<5;i++){
var divInfo =document.getElementById('div'+(i+1));
divInfo.style.display='none';
}
var div =document.getElementById('div'+id);
div.style.display='block';
}
</script>
</head>
<body>
<table width="632" border="1">
<tr>
<td width="66"><a href="javascript:funcShow(1)">1 </a></td>
<td width="550" colspan="4" rowspan="5">
<div id="div1" style="display:block">此处显示id "div1" 的内容aaaaaaaaaaa</div>
<div id="div2" style="display:none">此处d "div2" 的内容</div>
<div id="div3" style="display:none">此处显示id "di 容</div>
<div id="div4" style="display:none">此处显ccccccccccv4" 的内容</div>
<div id="div5" style="display:none">此处显示 bbbbbbbbbbb" 的内容</div></td>
</tr>
<tr>
<td><a href="javascript:funcShow(2)">2 </a></td>
</tr>
<tr>
<td><a href="javascript:funcShow(3)">3 </a></td>
</tr>
<tr>
<td><a href="javascript:funcShow(4)">4 </a></td>
</tr>
<tr>
<td><a href="javascript:funcShow(5)">5 </a></td>
</tr>
</table>
</body>
</html>
html页面,左边点击链接,右边显示内容参考代码。的更多相关文章
- ifram的使用 左边是<a>链接 右边是对应网页嵌套的显示网页链接内容 和toggle的收放用法
1.ifram的使用 左边是<a>链接 右边是对应网页嵌套的显示网页链接内容 <div class="container"> <div class= ...
- 仿美团外卖,饿了吗 两个ListView联动,左边点击切换右边,右边滑动切换左边
先上效果图: 实现思路: 1.先说右边标题: 首先,右边的数据源集合中的Javabean中含有三个属性name,type,title,而每个条目中会默认含有一个标题. 如果这是第一个条目,就让标题显示 ...
- 【jQuery02】点击标题面板显示内容
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- Vue 实现左边导航栏且右边显示具体内容(element-ui)
最终效果图: 现在开始进入正题: 1.安装element-ui npm i element-ui -S CDN 目前可以通过 unpkg.com/element-ui 获取到最新版本的资源,在页面上引 ...
- js控制div样式显示与隐藏,JS通过点击超链接右边(指定位置)显示一个图标
原文出自:https://blog.csdn.net/seesun2012 javascript基础篇,老土的方法解决js控制div样式,便于新手理解,粗暴的不能再粗暴,如果你是高手,请忽略! 思路: ...
- hexo next主题中关于pc端点击链接没问题,移动端点击链接页面不显示。
个人博客:https://mmmmmm.me 源码:https://github.com/dataiyangu/dataiyangu.github.io 背景 hexo next主题,本人diy的时候 ...
- 用A标签实现页面内容定位 点击链接跳到具体位置
经常在维基百科等网站看到目录列表,点击链接会跳到具体的位置,小美眉一直在问是怎么做到的,其实挺简单的,用A标签实现页面内容定位就行了.实例参考微信营销理论手册的目录. 首先用A标签定义目录的链接. & ...
- ASP.NET MVC WebApi 返回数据类型序列化控制(json,xml) 用javascript在客户端删除某一个cookie键值对 input点击链接另一个页面,各种操作。 C# 往线程里传参数的方法总结 TCP/IP 协议 用C#+Selenium+ChromeDriver 生成我的咕咚跑步路线地图 (转)值得学习百度开源70+项目
ASP.NET MVC WebApi 返回数据类型序列化控制(json,xml) 我们都知道在使用WebApi的时候Controller会自动将Action的返回值自动进行各种序列化处理(序列化为 ...
- 让超链接点击后不跳转,可以用href = "#",但是这个#就会锚点到页面最上边 点击链接后不跳转可以设置成
让超链接点击后不跳转,可以用href = "#",但是这个#就会锚点到页面最上边 点击链接后不跳转可以设置成 1.<a href="javascri ...
随机推荐
- 2016年12月3日 星期六 --出埃及记 Exodus 20:24
2016年12月3日 星期六 --出埃及记 Exodus 20:24 "`Make an altar of earth for me and sacrifice on it your bur ...
- Spring中MultipartHttpServletRequest实现文件上传
Spring中MultipartHttpServletRequest实现文件上传 转贴自:http://my.oschina.net/nyniuch/blog/185266 实现图片上传 用户必须能 ...
- Cheatsheet: 2015.02.01 ~ 02.28
Other API Best Practices: API Management Rewriting History with Git Rebase .NET Announcing Microsoft ...
- GoAccess日志分析工具使用文档
----Sevck 2016/3/4 17:24:13 #1软件说明: GoAccess是一款开源.实时,运行在命令行终端下的web日志分析工具.该工具提供快速.多样的HTTP状态统计,可以令管理员不 ...
- sqlmap基本命令
./sqlmap.py –h //查看帮助信息./sqlmap.py –u “http://www.anti-x.net/inject.asp?id=injecthere” //get注入./sqlm ...
- android的简单入门学习
话说光配环境就整死我了, 不是说多么难, 是最近google被屏了, 很多sdk里面需要下载的东西都下不下来, 坑爹啊. 最后跟扫拉稀要了一个他配置好的,才运行了. android目录分析: ass ...
- KaliLinux装好系统后安装常用软件
1.配置软件源 leafpad /etc/apt/source.list or(recommand):#官方源deb kali main non-free contribdeb-src kali ma ...
- compile,build和execute的区别
一个c程序的生成要经历以下步骤: 1.编写文本代码,生成c或cpp文件,这时候它还是文本的: 2.编译,就是compile,由c编译程序对你写的代码进行词法和句法分析,发现并报告错误,有错时编译不能通 ...
- ssis freach loop container 传入变量给 某些数据源的时候。
ssis freach loop container 传入变量给 某些数据源的时候. 应该选择loop container ,设置delayvalidateion为true. 这样数据源控件就不会报e ...
- GooglePlay_下载apk
关键字:"APK Downloader" 方式: (1)."APK Downloader"网站在线下载(无需我们的GooglePlay账户信息,也就无需Goog ...