87,902
社区成员
发帖
与我相关
我的任务
分享阻止DOM文档中所有对象的事件冒泡
问题是这样的
代码示例：
<html>
<head>
<script type="text/javascript">
var contents=document.getElementById('contents');
function show()
{
contents.style.visibility='visible';
}
function hidden()
{
contents.style.visibility='hidden';
}
function dosomething()
{
....
}
</script>
</head>
<body onclick="hidden();">
<a id="something" href="" onclick="dosomething();">something</a>
<a id="flag" href="" onclick="show();">show follow contents</a>
<div id="contents" style="visibility:hidden;">
.....
</div>
</body>
</html>
如上面代码所示，我希望在点击id为flag的链接的时候，显示ID为contents的DIV对象的内容，而在flag对象之外点击鼠标左键时，隐藏DIV的内容。但是我在点击id为something的链接时，由于事件的冒泡特性，所以也会隐藏DIV(因为something处在body内)。
上面的代码只是为了说明我想表达的意思而写的，我面临的真实情况是HTML中很多的元素都是由PHP的html类方法直接生成的，例如要生成一个链接就直接是$link=$html->create_link(‘a’,'name',array('onclick'=>'JS函数'))，第三个参数是为链接增加一个onclick事件，
所以，我不可能去修改html类（这个大家都清楚，这些基类在公司一般都是禁止修改的），我想用JS脚本来让DOM文档中所有的对象元素都禁止事件的冒泡，而不用为每个元素都写类似于event.cancelBubble=true;这样的JS代码。
我试了很久都不行，请赐教！ 没什么分了，请求大家帮个忙！
代码示例：
<html>
<head>
<script type="text/javascript">
var contents=document.getElementById('contents');
function show()
{
contents.style.visibility='visible';
}
function hidden()
{
contents.style.visibility='hidden';
}
function dosomething()
{
....
}
</script>
</head>
<body onclick="hidden();">
<a id="something" href="" onclick="dosomething();">something</a>
<a id="flag" href="" onclick="show();">show follow contents</a>
<div id="contents" style="visibility:hidden;">
.....
</div>
</body>
</html>
如上面代码所示，我希望在点击id为flag的链接的时候，显示ID为contents的DIV对象的内容，而在flag对象之外点击鼠标左键时，隐藏DIV的内容。但是我在点击id为something的链接时，由于事件的冒泡特性，所以也会隐藏DIV(因为something处在body内)。
上面的代码只是为了说明我想表达的意思而写的，我面临的真实情况是HTML中很多的元素都是由PHP的html类方法直接生成的，例如要生成一个链接就直接是$link=$html->create_link(‘a’,'name',array('onclick'=>'JS函数'))，第三个参数是为链接增加一个onclick事件，
所以，我不可能去修改html类（这个大家都清楚，这些基类在公司一般都是禁止修改的），我想用JS脚本来让DOM文档中所有的对象元素都禁止事件的冒泡，而不用为每个元素都写类似于event.cancelBubble=true;这样的JS代码。
我试了很久都不行，请赐教！ 没什么分了，请求大家帮个忙！
...全文
请发表友善的回复…
发表回复
