同学们帮我：onchange和onclick同时触发，而我只想要onchange触发，怎么办呢？

请大侠帮忙：我的一个table，里面的<td>调用了onclick去改变这个<td>的背景颜色，
这个<td>上有一个text的input，有onchange事件，
麻烦出来了，我改变了这个text,然后点了一下这个<td>，于是text的onchange和这个<td>的onclick同时触发了，
请同学们帮帮忙，如何只触发这个onchange，而不触发onclick呢？谢谢大家了。

解决方案 »

免费领取超大流量手机卡，每月29元包185G流量+100分钟通话, 中国电信官方发货

"我改变了这个text""于是text的onchange触发了",
"我然后点了一下这个<td>""于是这个<td>的onclick触发了"有什么不对吗？不仅如此，恐怕你通过点击input来给予焦点企图修改内容时，还会触发<td>的onclick事件。
<html>
<head>
<title>阻止冒泡--康董</title>
<style>
body{
color:#333;
font-size:12px;
}</style>
</head>
<body>
<p>什么是事件冒泡,通俗的来讲就是  我们为页面内body添加一个单击事件,同样再为页面内li元素添加一个单击事件..当你单击li的时候.<br>
body的事件也会被触发.....因为li被包含在body元素内...你单击了li同时也单击了body...这就是事件冒泡....<br />
在有些时候.我们要阻止这种情况发生...也就是单击li事件.不会触发body的事件.... 这就叫阻止冒泡!
<div id="a">
<ul id="lia">请单击下面的列表.会触发body事件
  <li>项目1</li>
  <li>项目2</li>
  <li>项目3</li>
</ul> <ul id="lib">请单下面的列表.不会触发body事件.
  <li>项目1</li>
  <li>项目2</li>
  <li>项目3</li>
</ul>
</div>
<script language="javascript">
document.body.onclick = function(){     //首先为body元素绑定一个单击事件
    alert("BODY事件");                  //单击页面即弹出对话框
}function att_Event(){                  //为第一组li元素绑定onclick事件
    var li = document.getElementById("lia").getElementsByTagName("li");
    for(var i=0;i<li.length;i++){
        li[i].onclick = function(){
           alert("Li事件");
        }
    }}function att_Event_b(){                  //为第二组li元素绑定onclick事件
    var li = document.getElementById("lib").getElementsByTagName("li");
    for(var i=0;i<li.length;i++){
        li[i].onclick = function(e){
           alert("Li事件");
           stopBubble(e);
        }
    }}function stopBubble(e){
    //如果传入了事件对象.那么就是非IE浏览器
    if(e && e.stopPropagation){
        //因此它支持W3C的stopPropation()方法
        e.stopPropagation();
    }
    else{
        //否则,我们得使用IE的方式来取消事件冒泡
        window.event.cancelBubble = true;
    }
}window.onload = function(){
    att_Event();
    att_Event_b();
}</script>
</body>
</html>
参考下上面这个，你这个情况就是冒泡了··
谢谢大家，我也阻止冒泡了，不行，
原因是一个是onchange一个是onclick就阻止不了，
如果两个都是onclick是可以阻止的。
你写了两件不相关的事情，然后分别做了两种事情，还要其中一件不发生，这个跟冒泡没有一毛钱的关系。使用事件委托。把事件写到 table上，设置计数器，判断来源，input的change事件发生，计数器赋值1，td的click事件时做判断，计数器非零的情况下不执行。
txt1.onclick不触发div1.onclick事件，txt1.onchange后,txt1.onclick首次无效
<body>
  <div id="div1">divvvvvvvvvvvvvvvvvvvv
    <input id="txt1" type="text" value="content" />
  </div>
</body>
window.onload = function () {
    var echo = function () {
            $(document.body).append('<hr/>' + [].join.apply(arguments));
        };
    var div1 = document.getElementById('div1');
    var txt1 = document.getElementById('txt1');
    var changed = false;
    txt1.onchange = function (event) {
        event = event || window.event;
        changed = true;
    };
    div1.onclick = function (event) {
        if (changed) {
            changed = false;
        } else {
            event = event || window.event;
            var target = event.target || event.srcElement;
            if (target.id === 'div1') {
                alert('do stuff');
            }
        }
    };
};
修正上楼
txt1.onclick不触发div1.onclick事件，txt1.onchange后,div1.onclick首次无效；
方法内的echo是我调试用的，请删掉；
div1.onclick的逻辑不对，应该先判断id，再判断changed
精简后的代码
window.onload = function () {
    var changed = false;
    document.getElementById('txt1').onchange = function () {
        changed = true;
    };
    document.getElementById('div1').onclick = function (event) {
        event = event || window.event;
        var target = event.target || event.srcElement;
        if (target === this) {
            if (changed) {
                changed = false;
            } else {
                alert('do stuff');
            }
        }
    };
};
这个太强大了，一个小小问题，我改了txt1的值，去点div1，的确第一次没有触发div1的onclick，
不过第二次也没有触发，要第三次才可以。
不过不管怎么说，这个的确很神奇，谢谢你了。
补充下，按您原来的代码，的确第一次屏蔽，我这里加了alert,就要2次了。
    document.getElementById('txt1').onchange = function () {
        changed = true;
        alert("aaa");    };
不用alert,用其他事件就是一次，你的代码很完美，再次感谢。