js 常见问题 3

(1)如何禁止f5刷新

用浏览器打开网页时,我们按f5 就会刷新当前网页,那么如何禁止f5刷新呢?

// ie下禁用f5刷新  

   document.onkeydown = function(){  

       if(window.event && window.event.keycode == 116){  

           window.event.keycode = 505;  

        }  

       if(window.event && window.event.keycode == 505){  

           return false;  

       }  

   };  

   $(document).keydown(function (event) {  

           // firefox下禁用f5刷新  

           if(event.keycode == "116"){  

               event.keycode = "505";  

           }  

           if(event.keycode == 505) {  

               return false;  

       });  

(2)如何禁止选中文本

 对于ie 

window.onload=function()  

    {  

        var movespan222=$('#movespan');  

        //alert(movespan222);  

        drag(movespan222);  

        if(isietest){//当浏览器是ie时  

            com.whuang.hsj.$$id('movespan').onselectstart=function()//禁止文本被选中  

            {  

                return false;  

            }  

    }  

 使文本所在控件的onselectstart 事件返回false

对于火狐和谷歌浏览器,使用css实现:

.cannot_select{  

    -moz-user-select:none;/*火狐*/  

    -webkit-user-select:none;/*webkit浏览器*/  

    -ms-user-select:none;/*ie10*/  

    -khtml-user-select:none;/*早期浏览器*/  

    user-select:none;  

}  

(3)获取div的高度和宽度

var divobj;  

//获取div对象  

divobj.offsetwidth;//div 的宽度  

divobj.offsetheight;//div 的高度  

 参考:

http://hw1287789687.iteye.com/blog/2151517

http://huangkunlun520.blog.51cto.com/2562772/1570707

//添加图标  

   var h4_222=$('.condition h4');  

   //使用jquery 创建html控件  

   var imagecreate='<img class="togglecollapse" style="margin-top: 4px;" title="展开/收起" src="images/toggle-collapse.png">';  

   var toggleimg=$(imagecreate);  

   h4_222.append(toggleimg);  

(5)jquery 折叠和收起

<span style="line-height: 25.200000762939453px;"> var h4_list=$('.list_header');  

    var toggleimg_resultlist=$(imagecreate);  

    h4_list.append(toggleimg_resultlist);  

    toggleimg .toggle(function(){  

//        console.log($(this).parent().next());  

        var this22=$(this);  

        this22.parent(). next().slideup("normal",function(){  

//            alert(222);  

            this22.attr("src","images/toggle-expand.png");  

        });  

        // $(this).next().slidedown("slow");  

    },function(){  

        this22.parent().next().slidedown("normal",function(){  

//            alert(11);  

            this22 .attr("src","images/toggle-collapse.png");  

    });  

toggleimg_resultlist.toggle(function(){  

        h4_list.next().slideup("normal",function(){  

        h4_list.next().slidedown("normal",function(){  

    });</span>  

(6)获取屏幕大小

(7)判断js对象是否包含属性

使用in

实例:

if((typeof name22 != 'string')&& ('value' in name22)){  

       // name22=name22.value;  

        return name22.value;  

if (!('length' in checkboxobj)) {// just only single checkbox .  

        return checkboxobj.checked;  

 (8)获取字符串后面的数字

var input='ad3344aa';  

var result=input.replace(/[\a-za-z\s ]*[^\d](\d+)[^\d]?.*$/g, "$1");  

alert('cc'+result+'bb');  

 运行结果:

cc3344bb

(9)获取浏览器窗口大小

//跨浏览器获取视口大小  

function getinner() {  

    if (typeof window.innerwidth != 'undefined') {  

        return {  

            width : window.innerwidth,  

            height : window.innerheight  

    } else {  

            width : document.documentelement.clientwidth,  

            height : document.documentelement.clientheight  

 兼容浏览器ie7,8,9,火狐,chrome.

测试:

window.onload=function(){  

            alert(getinner().width);  

(10)获取滚动条的位置

// 跨浏览器获取滚动条位置  

function getscroll(){  

    return {  

        top:document.documentelement.scrolltop || document.body.scrolltop,  

        left:document.documentelement.scrollleft || document.body.scrollleft  

兼容浏览器ie7,8,9,火狐,chrome. 

var abc=function(){  

          alert(document.documentelement.scrolltop+"\t:"+getscroll().top);  

        }