这次做项目由于某些特殊要求,要在div上加链接,里面的div又是其他的链接,所以我在这时候才知道了事件的冒泡,下面是找到的很好的解决方案:
http://www.cnblogs.com/jiqing9006/archive/2012/09/11/2679831.html
实例:
<div class="item" οnclick="window.open('/tribe/tribeDetails.html?tribeId=${tribe.tid}')">
<div class="ind o-hidden tribe_tx01">
<div url="/user/center/guyIndex.html?uid=${tribe.uid}" class="icon fl o-hidden allTribeDiv" >
<a class="color4a" ><img style="width:30px;height:30px;border-radius:60%;" src="${hp.getHeadPhotoLarge(tribe.uid!)}"
οnerrοr="this.οnerrοr='';this.src='${hp.getDefaultHeadPhotoLarge()}'"/></a>
</div>
<div url="/user/center/guyIndex.html?uid=${tribe.uid}" class="name fl o-hidden font14 taribe_nm allTribeDiv">
<a class="color4a" >
<% if ( tribe.createNickName !=null && strutil.length(tribe.createNickName) >= 12 ) { %>
${strutil.subStringTo(tribe.createNickName,0,12)}...
<%} else { %>
${tribe.createNickName!" "}
<% } %>
</a>
</div>
</div>
<div class="pic o-hidden posr">
<a >
<img src="${hp.getImageRootPath()}recommend/P/tribe_indexpage/${cityModel.id!''}/${tribe.typeId!''}/${tribe.id!''}/${tribe.id!''}.jpg"
οnerrοr='this.οnerrοr="";this.src="${hp.getTribeImageLarge(tribe.tid!)}"'/>
</a>
<% if(tribe.relation==1){ %>
√已加入
<% }else if(tribe.relation>=2){ %>
我是酋长
<% }else{ %>
<input type="button" class="input-join posa br5 bg-deep-orange btn-hover cp white yahei tribeInput"
url="/tribe/joinTribe.html?tribeId=${tribe.tid}" value="+加入">
<% } %>
</div>
<div class="info o-hidden bg-white" >
<h4 class=" normal text-center" style=" height:20px; width:272px; margin-top:18px; margin-bottom:20px; font-size:20px;">
<a>
${tribe.name!''}
</a>
</h4>
<p class="font12 o-hidden color79 text-center" style="height:12px; width:272px;">
<a class="color79">
${tribe.introduce!''}
</a>
</p>
</div>
</div>
JS:
<script>
$(function(){
// 为span元素绑定click事件
$(".allTribeDiv").click(function(event){//由于是循环,所以绑定的是class
var url = $(this).attr("url");
window.open(url);
event.stopPropagation(); // 阻止事件冒泡
});
});
$(".tribeInput").bind("click",function(event){
var url = $(this).attr("url");
<% if(isEmpty(session.uid)){%>
layer.msg("您还没有登录,请先登录!",{icon:3});
event.stopPropagation(); // 阻止事件冒泡
<% }else{%>
window.location.href = url;
event.stopPropagation(); // 阻止事件冒泡
<% } %>
})
</script>