<
html
>
<
head
>
<
title
>pic</
title
><
script
src
=
"jquery.js"
></
script
>
</
head
>
<
body
>
<
meta
http-equiv
=
"Content-Type"
content
=
"text/html"
charset
=
"utf-8"
/>
<
p
align
=
"center"
><
img
src
=
"1.jpg"
usemap
=
"#1"
boarder
=
0
></
p
>
<
map
name
=
"1"
id
=
"1"
>
<
area
shape
=
"rect"
coords
=
"124,120,170,176"
href ="
<area
shape
=
"rect"
coords
=
"179,133,224,189"
href ="
<area
shape
=
"rect"
coords
=
"247,113,272,147"
href ="
</map>
<
script
>
$(".rect1").click(function(){this.href="javascript:void(0);";});
$(".rect2").click(function(){this.href="javascript:void(0);";});
$(".rect3").click(function(){this.href="javascript:void(0);";});
</
script
>
</
body
>
</
html
>
这个好像是百度知道上的答案吧,我试过了不能用
@hhh2014: 不能用。。
程序员
如果没有跳转,点击后去掉href属性,或者去掉area也应该是可以的,
如果有跳转,应该服务器端去做了吧
这个我只想告诉你一个思路,就是使用ajax刷新,你点击一下,触发了事件,然后ajax刷新页面,把你的图片放入一个div,然后把热点取消就成了。
绑定one()事件,点击一次
热点 换成a 定位上去 点击的时候用one()
增加一层div呢
1 <html> 2 <head> 3 <title>pic</title> 4 </head> 5 <body> 6 <meta http-equiv="Content-Type" content="text/html" charset="utf-8"/> 7 <p align="center"><img src="http://h.hiphotos.baidu.com/zhidao/pic/item/32fa828ba61ea8d37ae4684d950a304e241f58b0.jpg" usemap="#1" boarder=0 ></p> 8 <map name="1" id="1"> 9 <area shape="rect" coords="31,27,159,132" href ="" onClick="this.href='javascript:void(0)';"> 10 11 <area shape="rect" coords="204,28,331,131" href ="" onClick="this.href='javascript:void(0)';"> 12 13 <area shape="rect" coords="367,25,492,128" href ="" onClick="this.href='javascript:void(0)';"> 14 15 </map> 16 </body> 17 </html>
这是你要的菜吧,这么简单的动作就不要用JQ了
1 <html> 2 <head> 3 <title>pic</title> 4 </head> 5 <body> 6 <meta http-equiv="Content-Type" content="text/html" charset="utf-8"/> 7 <p align="center"><img src="http://h.hiphotos.baidu.com/zhidao/pic/item/32fa828ba61ea8d37ae4684d950a304e241f58b0.jpg" usemap="#1" boarder=0 ></p> 8 <map name="1" id="1"> 9 <area shape="rect" coords="31,27,159,132" href ="javascript:void(0)" onClick="this.parentNode.removeChild(this);"> 10 11 <area shape="rect" coords="204,28,331,131" href ="javascript:void(0)" onClick="this.parentNode.removeChild(this);"> 12 13 <area shape="rect" coords="367,25,492,128" href ="javascript:void(0)" onClick="this.parentNode.removeChild(this);"> 14 15 </map> 16 </body> 17 </html>
单击删除描点,,新测,,,结帖吧,大哥,,给分我,我也有问题问别的大神,,互相学习咯
上面第一次回复的方法是设置href不可用,,但是鼠标放上面还是有手形,
这次回复的方法是删除你添加的热点,干干净净
可以考虑增减class选择符
这是PHP吧 不懂
html文件
<div class="warp" id="linkGroup"> <img src="2327f9e95c1699a37caa8c7b17a7e179.png"> <a id='link1' class="link link-1" href="https://www.baidu.com/" target="_blank"></a> <a id='link2' class="link link-2" href="http://www.163.com/" target="_blank"></a> <a id='link3' class="link link-3" href="http://www.qq.com/" target="_blank"></a> </div>
css文件
*{ padding: 0; margin: 0; } .warp{ position: relative; display: inline-block; *display:inline; zoom: 1; } .link{ position: absolute; display: block; } .link-1{ top:0; left: 0; width: 40%; height: 50%; } .link-2{ bottom: 0; right: 0; width: 15%; height: 15%; } .link-3{ bottom: 0; left: 0; width: 10%; height: 15%; }
js代码
var linkGroup = document.getElementById('linkGroup'); linkGroup.onclick = function(event){ var event,target,parent; event = event || window.event; target = event.target || event.srcElement; if(target.tagName.toLowerCase() === 'a'){ parent = target.parentNode; parent.removeChild(target); } };
点击之后设置display:none