click事件冲突,如何解决?
下面的select_items()让点击目标添加“.selected”css属性,如果遇到a或button取消他们的默认动作。
但这样和hotkeys_condition()冲突,点击<a href="#">page a 1</a>时无法执行alert(1);
如何解决冲突?
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript">
function select_items(){
$(".page *").click(function(e){
if($(".selected")[0]){
if($.trim($(".selected")[0].className)=="selected"){
$(".selected").removeAttr("class");
}else{
$(".selected").removeClass("selected");
}
}
$(e.target).addClass("selected");
return false; // 不让点击a 或button 执行默认动作,
//但这样和hotkeys_condition()中的点击.page a冲突,无法执alert(1);
});
}
$(function(){
select_items();
});
var hk=0;
var hk_old=0;
function hotkeys_condition(){
var hotkey_if_obj={
".framework_right *" : 0,
".framework_hidden *" : 0,
".page *" : 1,
".follow_info" : 1,
".color_items" : 1
}
$.each(hotkey_if_obj,function(i,n){
$(i).live("click",function(){
hk_old=hk;
hk=n;
switch((hk-hk_old)){
case -1 : alert(-1); break;
case 0 : alert(0); break;
case 1 : alert(1); break;
}
})
});
}
$(function(){
hotkeys_condition();
});
</script>
<div class="framework_right">
<span>.framework_right 0</span>
</div>
<div class="framework_hidden">
<span>.framework_hidden 0</span>
</div>
<div class="page">
<span>page 1</span>
<a href="#">page a 1</a>
</div>
<div class="follow_info">
follow_info 1
</div>
<div class="color_items">
color_items 1
</div>
下面的select_items()让点击目标添加“.selected”css属性,如果遇到a或button取消他们的默认动作。
但这样和hotkeys_condition()冲突,点击<a href="#">page a 1</a>时无法执行alert(1);
如何解决冲突?
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript">
function select_items(){
$(".page *").click(function(e){
if($(".selected")[0]){
if($.trim($(".selected")[0].className)=="selected"){
$(".selected").removeAttr("class");
}else{
$(".selected").removeClass("selected");
}
}
$(e.target).addClass("selected");
return false; // 不让点击a 或button 执行默认动作,
//但这样和hotkeys_condition()中的点击.page a冲突,无法执alert(1);
});
}
$(function(){
select_items();
});
var hk=0;
var hk_old=0;
function hotkeys_condition(){
var hotkey_if_obj={
".framework_right *" : 0,
".framework_hidden *" : 0,
".page *" : 1,
".follow_info" : 1,
".color_items" : 1
}
$.each(hotkey_if_obj,function(i,n){
$(i).live("click",function(){
hk_old=hk;
hk=n;
switch((hk-hk_old)){
case -1 : alert(-1); break;
case 0 : alert(0); break;
case 1 : alert(1); break;
}
})
});
}
$(function(){
hotkeys_condition();
});
</script>
<div class="framework_right">
<span>.framework_right 0</span>
</div>
<div class="framework_hidden">
<span>.framework_hidden 0</span>
</div>
<div class="page">
<span>page 1</span>
<a href="#">page a 1</a>
</div>
<div class="follow_info">
follow_info 1
</div>
<div class="color_items">
color_items 1
</div>
<script type="text/javascript">
function select_items(){
$(".page *").live("click",function(e){
if($(".selected")[0]){
if($.trim($(".selected")[0].className)=="selected"){
$(".selected").removeAttr("class");
}else{
$(".selected").removeClass("selected");
}
}
$(e.target).addClass("selected");
return false;
});
}
var hk=0;
var hk_old=0;
function hotkeys_condition(){
var hotkey_if_obj={
".framework_right *" : 0,
".framework_hidden *" : 0,
".page *" : 1,
".follow_info" : 1,
".color_items" : 1
}
$.each(hotkey_if_obj,function(i,n){
$(i).live("click",function(){
hk_old=hk;
hk=n;
switch((hk-hk_old)){
case -1 : alert(-1); break;
case 0 : alert(0); break;
case 1 : alert(1); break;
}
})
});
}
$(function(){
hotkeys_condition();
select_items();
});
</script>
<div class="framework_right">
<span>.framework_right 0</span>
</div>
<div class="framework_hidden">
<span>.framework_hidden 0</span>
</div>
<div class="page">
<span>page 1</span>
<a href="#">page a 1</a>
</div>
<div class="follow_info">
follow_info 1
</div>
<div class="color_items">
color_items 1
</div>
return false;
改为
e.preventDefault();
就可以。
是经典论坛的一位高手 jiangliuhuo 帮忙解决的。
http://bbs.blueidea.com/thread-2978267-1-1.html
没见过cancelBuble,查了一下,是指“如果事件句柄想阻止事件传播到包容对象,必须把该属性设为 true。”
尝试将 return false;
改为 e.cancelBuble=true;
可以alert(1),但却让a链接跳转,和我想的效果不相符。