小知识随手记

Posted 古兰精

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了小知识随手记相关的知识,希望对你有一定的参考价值。

1、JS禁止BackSpace键:

function dokey(e){
            var ev =e || window.event;//获取event对象
            var obj = ev.target || ev.srcElement;//获取事件源
            var t = obj.type || obj.getAttribute("type");//获取事件源类型
            if(ev.keyCode === 8 && t !== "password" && t !== "text" && t !== "textarea"){
                return false;
            }
        }
        document.onkeypress = dokey;//禁止后退键,作用于Firefox、Opera
        document.onkeydown = dokey;//禁止后退键,作用于IE、Chrome

  此问题有个bug就是当鼠标放在一个不可编辑的输入框上的时候,退格键依然会产生页面后退效果!所以修改一下:

function dokey(e){
        var ev =e || window.event;//获取event对象
        var obj = ev.target || ev.srcElement;//获取事件源
        var t = obj.type || obj.getAttribute("type");//获取事件源类型
        var vReadOnly = obj.readOnly;//获取作为判断条件的事件类型
        vReadOnly = (vReadOnly === undefined) ? false : vReadOnly;
        //当敲Backspace键时,事件源类型为密码或单行、多行文本的,并且readOnly属性为true则退格键失效
        var flag1 = ev.keyCode == 8 && (t=="password"||t=="text"||t=="textarea") && (vReadOnly==true);
        //当敲Backspace键时,事件源类型非密码或单行、多行文本的,则退格键失效
        var flag2 = ev.keyCode == 8 && t != "password" && t != "text" && t != "textarea";
        if(flag1 || flag2){
            return false;
        }
    }
    document.onkeypress = dokey;//禁止后退键,作用于Firefox、Opera
    document.onkeydown = dokey;//禁止后退键,作用于IE、Chrome

  还有种情况就是disabled的时候,试验了下发现给input disabled 的时候,其类型就变成了 t == null,所以可以暂时不予考虑。

2、关于this重定向的问题:

  对于window的一些自己的方法,比如setTimeout()、setInterval()方法里面涉及到this对象时,均会需要this重定向的,这点需要注意。

<script>
window.onload=function(){
    var aBtn=document.getElementsByTagName(input);
    var that=null;//定义一个空对象用于承载this
    for(var i=0;i<aBtn.length;i++){
        aBtn[i].onclick = function(){
            that = this;//给that赋值this,this指点击的按钮button对象
            fn1();
        };
    }
    function fn1(){
        that.style.background=red;//fn1里的this指的是window对象,所以需要this重定向为button对象
    }
};
</script>
</head>
<body>
<input type="button" value="btn1" />
<input type="button" value="btn2" />
<input type="button" value="btn3" />
</body>

3、

 

以上是关于小知识随手记的主要内容,如果未能解决你的问题,请参考以下文章

小知识随手记

小知识随手记

小知识随手记

随手记——在Linux下如何测试代码执行时间

随手记——在Linux下如何测试代码执行时间

零碎知识点(随手记)