Javascript DIV

Question

<div onMouseOver="alert('a')" style=" height:400px; width:500px; padding:20px; border:1px solid #000000"> 
  <div id='t1' onMouseOver="event.cancelBubble = true "  style=" height:50px; width:200px; padding:20px; border:1px solid #000000">1 </div> 
  <div id='t2' onMouseOver="event.cancelBubble = true "  style=" height:50px; width:200px; padding:20px; border:1px solid #000000">2 </div> 
<div id='t2' onMouseOver="event.cancelBubble = true  "  style=" height:50px; width:200px; padding:20px; border:1px solid #000000">3</div> 
<div id='t2' onMouseOver="event.cancelBubble = true  "  style=" height:50px; width:200px; padding:20px; border:1px solid #000000">4</div> 
</div> 
阻止事件冒泡cancelBubble = true  

Answer 1

你over里面的时候一定会over外面的，看下面的代码就知道，触发了里外2个onmouseover，貌似没什么好的解决办法...<script>
    function show(c)
    {
        alert(c.id);
    }
</script>
  <div id="total" onmouseover="show(this)"> 
  <div id='t1'>1 </div> 
  <div id='t2'>2 </div> 
  <div id='t3' onmouseover="show(this)">3 </div> 
  <div id='t4' onmouseover="show(this)">4 </div> 
</div>

Answer 2

那还不如
<div>
  <div id='t1'>1 </div>
  <div id='t2'>2 </div>
  <div id='t3'>3 </div>
  <div id='t4'>4 </div>
<div onmourseover="alert('111')"></div>
</div> 

Answer 3

实现里面4个div切换时 不触发最外层div的onmourseover事件

Answer 4

<div id="t0" onmouseover="checkandshow(this.id)" > 
  <div id='t1' onmouseover="checkandshow(this.id)">1 </div> 
  <div id='t2' onmouseover="checkandshow(this.id)">2 </div> 
  <div id='t3' onmouseover="checkandshow(this.id)">3 </div> 
  <div id='t4' onmouseover="checkandshow(this.id)">4 </div> 
</div> 
 <script language="javascript">
function checkandshow(x)
{
  if(this.id!="t0")
  {
   alert("1");
  }
  else
  {
  alert("2");
  }
} 
</script>
好像不行

Answer 5

不过.我们在程序中一般都是可以控制它的,可以通过判断来实现我们想要的效果.
function checkEvent()
{ 
if(window.event)
{
var obj = event.srcElement;
var objId = obj.id;
switch(objId)
{
case "tt":
...
break;
case "t1":
//不触发相应的事件
break;
case "t2":
...
}
}
}<div onmourseover="checkEvent">
  <div id='t1'>1 </div> 
  <div id='t2'>2 </div> 
  <div id='t3'>3 </div> 
  <div id='t4'>4 </div> 
</div> 

Answer 6

再深入点，貌似还有问题存在， 从外层的div到内层的div，是不再触发onMouseOver="alert('a')" 
但是反过来，从内层的div到外层来，又触发了一次！（ 既然内层的div包含在外层的div内， 按理说是不再触发的！）等待高手解答， 苦闷ing~~~