一些CSS/JS小技巧

CSS部分

1、文本框不可点击

.inputDisabled{ background-color: #eee;cursor: not-allowed;}

2、禁止复制粘贴

onpaste="return false" oncontextmenu="return false" oncopy="return false" oncut="return false"

JS部分

1、实现复选框部分选中状态

1 <input id="chk1" type="checkbox" />
2 <script>
3     document.getElementById('chk1').indeterminate = true;
4 </script>

2、浅拷贝　　参考：http://www.ruanyifeng.com/blog/2010/05/object-oriented_javascript_inheritance_continued.html

1 function extendCopy(p) {
2     var c = {};
3     for (var i in p) {　　　　　　
4         c[i] = p[i];　　　　
5     }
6     c.uber = p;
7     return c;　　
8 }

3、深拷贝　　参考：http://www.ruanyifeng.com/blog/2010/05/object-oriented_javascript_inheritance_continued.html

function deepCopy(p, c) {　　　　
    var c = c || {};　　　　
    for (var i in p) {　　　　　　
        if (typeof p[i] === 'object') {　　　　　　　　
            c[i] = (p[i].constructor === Array) ? [] : {};　　　　　　　　
            deepCopy(p[i], c[i]);　　　　　　
        } else {　　　　　　　　　
            c[i] = p[i];　　　　　　
        }　　　　
    }　　　　
    return c;　　
}

4、生成lowerValue(包括)到 upperValue(包括)的随机整数。

1 function selectFrom(lowerValue, upperValue) {
2     var choices = upperValue - lowerValue + 1;
3     return Math.floor(Math.random() * choices + lowerValue);
4 }

5、确定属性是原型中的属性

1 function hasPrototypeProperty(object, name) {
2     return !object.hasOwnProperty(name) && (name in object);
3 }

6、跨浏览器取得窗口左边和上边的位置

1 var leftPos = (typeof window.screenLeft == "number") ? window.screenLeft : window.screenX;
2 var topPos = (typeof window.screenTop == "number") ? window.screenTop : window.screenY;

7、获取地址栏参数

 1 /*
 2 获取页面url参数
 3 调用方法：
 4 alert(GetQueryString("参数名1"));
 5 alert(GetQueryString("参数名2")); 
 6 */
 7 function getQueryString(name) {
 8     var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
 9     var r = window.location.search.substr(1).match(reg);
10     if (r != null) return unescape(r[2]);
11     return null;
12 }
13 /*
14 获取页面url参数
15 调用方法：
16 Request = GetRequest(); 
17 var 参数1,参数2,参数3,参数N; 
18 参数1 = Request['参数1']; 
19 参数2 = Request['参数2']; 
20 
21 */
22 function GetRequest() {
23     var url = location.search; //获取url中"?"符后的字串 
24     var theRequest = new Object();
25     if (url.indexOf("?") != -1) {
26         var str = url.substr(1);
27         strs = str.split("&");
28         for (var i = 0; i < strs.length; i++) {
29             theRequest[strs[i].split("=")[0]] = unescape(strs[i].split("=")[1]);
30         }
31     }
32     return theRequest;
33 }

8、计算元素在页面的偏移量

 1 //左偏移量
 2 function getElementLeft(element) {
 3     var actualLeft = element.offsetLeft;
 4     var current = element.offsetParent;
 5     while (current !== null) {
 6         actualLeft += current.offsetLeft;
 7         current = current.offsetParent;
 8     }
 9     return actualLeft;
10 }
11 //上偏移量
12 function getElementTop(element) {
13     var actualTop = element.offsetTop;
14     var current = element.offsetParent;
15     while (current !== null) {
16         actualTop += current.offsetTop;
17         current = current.offsetParent;
18     }
19     return actualTop;
20 }

9、判断浏览器类型

 1 function getBrowserType() {
 2     var ua = navigator.userAgent.toLowerCase(), browserType = "";
 3     if (window.ActiveXObject) {
 4         //Sys.ie = ua.match(/msie ([d.]+)/)[1];
 5         Sys.ie = ua;
 6         browserType = "IE";
 7     }
 8     else if (document.getBoxObjectFor) {
 9         //Sys.firefox = ua.match(/firefox/([d.]+)/)[1];
10         Sys.firefox = ua;
11         browserType = "firefox";
12     }
13     else if (window.MessageEvent && !document.getBoxObjectFor) {
14         //Sys.chrome = ua.match(/chrome/([d.]+)/)[1];
15         Sys.chrome = ua;
16         browserType = "chrome";
17     }
18     else if (window.opera) {
19         //Sys.opera = ua.match(/opera.([d.]+)/)[1];
20         Sys.opera = ua;
21         browserType = "opera";
22     }
23     else if (window.openDatabase) {
24         //Sys.safari = ua.match(/version/([d.]+)/)[1];
25         Sys.safari = ua;
26         browserType = "safari";
27     }
28     return browserType;
29 }