鼠标点击一个DIV里的a标签时,在另外一个DIV显示出该a标签的内容

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>aaa</title>
<style>
#div0{
width:700px;
height:500px;}
#div1{
width:300px;
height:200px;
float:left;
background-color:#CCCCCC;}
#div2{
width:300px;
height:200px;
float:right;
background-color:#F00;}

</style>
</head>

<body>
<div id="div0">
<div id="div1">
<ul>
<li><a href="MyHtml.html" class="tabon">1</a></li>
<li><a href="MyHtml.html">2</a></li>
<li><a href="MyHtml.html">3</a></li>
<li><a href="MyHtml.html">4</a></li>
<li><a href="MyHtml.html">5</a></li>
</ul>
</div>
<div id="div2"></div>
</div>
</body>
</html>
我需要的是在div2这个块中显示MyHtml.html这个文件里面的内容,而不是把a标签的a字母显示到div中,如果不行我只能用frameset重新写一个网页了。。。大神们谢谢了~~~~~本人分不多,望高手指点一二,实在是想不出来。。。
什么方法都可以,只要能实现这个功能。

第1个回答  2015-09-29

很简单 就是选项卡切换的原理


我给你举个例子

代码你自己下载下来  不要忘了引入那个js



本回答被提问者采纳

两个div模块,左边div里放a标签,点击a标签,在右边div显示,这个功能要
display: none;} <\/style><\/head><body><div id="box1"><a href="###">点击我出现蓝盒子<\/a><\/div><div id="box2"><\/div><script type="text\/javascript"> var a = document.getElementsByTagName('a')[0], box2 = document.getElementById('box2'), flag = 1;...

js点击外部div实现内部a标签的方法
1、首先需要引入jquery脚本文件。2、其次添加一些简单的html,需要添加对应的点击事件函数,在函数中,先利用jquery的选择器方法来获取到a链接。3、然后获取到链接后,就用一个for循环来得到div里所有链接的id,主要是通过jquery的attr方法来得到每个链接控件的id属性,得到后,将其保存进数组里,通过alert...

当点击一个<a>标签时,页面中的某个<div>层显示,当点击页面中的其他区...
divId1.style.display=(divId1.style.display=="none")?"block":(divId1.style.display=="block"?"none":"block");divId2.style.display=(divId2.style.display=="none")?"block":(divId2.style.display=="block"?"none":"block");} 这样就能实现两个<div>的显示隐藏了。如果是多个<...

点击div实现a标签的跳转效果
<div id="ttt" style="width:100px; height:100px; background-color:#ccc;"><\/div>window.onload = function(){ var obj = document.getElementById('ttt'); obj.onclick=function(){ window.location.href="跳转的地址"; } } ...

点击a标签的文字出先一个div 刚打开页面时div隐藏
这个我不能给你代码,告诉你一些关键的地方吧 如果你是想实现遮罩的那种效果,应该讲div的css属性里边的z-index设置的大一些 定位方面也要考虑 父级标签relative,子标签absolute 控制显示隐藏,就用js操作div的display属性,block为显示,none为隐藏,none和hidden的区别就是,将其完全从文档流中移除,不...

html如何实现鼠标悬停提示A标签内容
一、直接title内容换行 直接填写title内容时候“回车键”换行,示例代码如下: <a href='http:\/\/www.PHP.cn' target='_ablank' title='标 题:DIVCSS5 作 者:DIVCSS5 更新时间:2013-05-17 推荐等级:无 关键字:title换行 分页方式:不分页 阅读等级:普通'>html title属性换行<\/a>二、使...

js 点击li标签下的a 跳出对应的li标签div内容
(".open").on('click', function () { var li = $(event.target).parent('li')alert(li.find('div.text').text())document.getElementById('log').style.display = 'block';document.getElementById('fade').style.display = 'block';return false });...

为什么div中里面嵌入几个div,外层的div会溢出一个像素?
1).垂直居中.将 line-height 设置为 当前 div 相同的高度, 再通过 vertical-align: middle.( 注意内容不要换行.)2).水平居中. margin: 0 auto;(当然不是万能)3, 若需给 a 标签内内容加上 样式, 需要设置 display: block;(常见于导航标签)4, FF 和 IE 对 BOX 理解的差异导致相差 2px 的还有设为 ...

用JS输出指定id的<a>标签中的文字
这个函数是click处理函数, 所以this指向点击的a元素 故获取其中文字有以下方案可选 this.innerHTML this.innerText (this).html()(this).text()

...鼠标经过图片 然后旁边显示字体 或者 在另外一个模块内显示内容_百 ...
<img src="路径" title="DREAM" alt=""\/> title加东西就行了

相似回答