javascript - 求知道的大神解释一下这两个事件的区别

Question

<script type="text/javascript">
     window.onload = function(){
     //方法1：
            var text = document.getElementById('text');
            text.onkeydown = function(e){                   //   阻止input框输入空格
                var keynum = e.keyCode||e.which;
                if(keynum == 32){
                    return false;
                }else{
                    return true;
                }
            }
             //方法2：
            text.addEventListener('keydown',function(e){  //为什么这个阻止不了unput框输入空格
                var keynum = e.keyCode||e.which;
                if(keynum == 32){
                    return false;
                }else{
                    return true;
                }
            },false);
        }
    </script>
    <input type="text" id="text" name='username'>

Answer 1

个人愚见,应该是IE和其他浏览器阵营的历史原因导致的. onEvent 这种方式是IE采用的，可以用returnValue的方式阻止事件的传播，所以onkeydown return false时候，就不能输入空格了。
但是像firefox, chrome之类的浏览器推广的addEventListener是通过e.preventDefault()的方式阻止事件传播, 单单returnValue没有效果。所以正确的是

javascripttext.addEventListener('keydown',function(e){  //为什么这个阻止不了unput框输入空格
                var keynum = e.keyCode||e.which;
                if(keynum == 32){
                    if(e.preventDefault) e.preventDefault()
                    return false;
                }else{
                    return true;
                }
            },false);

像这种东西，能用jquery还是尽量用jquery吧

Answer 2

text.addEventListener('keydown',function(e){  
            var keynum = e.keyCode||e.which;
            if(keynum == 32){
                e.preventDefault();
            }
        },false);

奇怪换成e.preventDefault() 又成功了