我有情况:
<div id="main">
<div id="a"></div>
<div id="b"></div>
</div>
在我的网页上,元素B
位于A
下。如何将click仅绑定到B元素之上的A元素?例如:
$('#main, #main > #b').click(function(){
//something
});
EDIT2:当我单击父div或“b”元素时,此代码是正常的,但是当我点击“A”元素时,没有任何反复发生。
一般来说我想只点击B元素,但是当A元素高于B时,我想要将事件激活到。 谢谢!
编辑:很遗憾,我无法修改HTML代码。
答案 0 :(得分:1)
检查一下,当我在你的问题中留下评论时,我制作了一个脚本,通过使用jquery库来向你展示我的意思,HERE IS THE LINK
HTML:
<div id="main">
<div id="a">A</div>
<div id="b">B</div>
</div>
CSS:
#main div{width:100px;height:100px;display:block;position:absolute;margin:10px;top:0;left:0;line-height:100px;text-align:center;}
#main #a{background:#DDD;top:5px;left:5px;}
#main #b{background:#999;color:#FFF;}
jquery脚本:
//onHover B do the next...
$('#b').hover(function(){
// actual B element move below
$(this).css('zIndex', -1);
});
//onHover A do the next...
$('#a').hover(function(){
// nothing on hover
},function(){
// but onHoverOut do next...
$('#b').css('zIndex', 'auto');
});
答案 1 :(得分:0)
我没有线索为什么你这样做,但仍然......
$('#a').click(function(e) {
e.preventDefault();
$('#b').click();
});
答案 2 :(得分:0)
也许这就是你要找的东西:
HTML:
<div id="main">
<div id="a">A</div>
<div id="b">B</div>
<div id="c">C</div>
</div>
jQuery的:
$(document).ready(function() {
$("#main div").each(function() {
// bind each div to the click event
$(this).click(function() {
alert("hah!");
});
// if we have reached "b", stop binding events to any following divs
if ($(this).attr('id') == "b") {
return false;
}
});
});
JSFiddle:http://jsfiddle.net/U6J8c/