jQuery的小知识的整理

来源：互联网发布：mac桌面日历备忘录编辑：程序博客网时间：2024/05/10 07:15

1、

event.preventDefault();
event.stopPropagation();

event.preventDefault()
该方法将通知 Web 浏览器不要执行与事件关联的默认动作（如果存在这样的动作）。例如，如果 type 属性是 "submit"，在事件传播的任意阶段可以调用任意的事件句柄，通过调用该方法，可以阻止提交表单。注意，如果 Event 对象的 cancelable 属性是 fasle，那么就没有默认动作，或者不能阻止默认动作。无论哪种情况，调用该方法都没有作用。

event.stopPropagation()
该方法将停止事件的传播，阻止它被分派到其他 Document 节点。在事件传播的任何阶段都可以调用它。注意，虽然该方法不能阻止同一个 Document 节点上的其他事件句柄被调用，但是它可以阻止把事件分派到其他节点。

经常用在例如，一个click触发多个事件的时候

阻断掉其他事件的相应

2、

0 == '0'

===是强等于符号

3、

jQuery的bind函数，传参数问题：

$('#startDateID').bind('click', starD.showStartDate);

showStartDate: function (event) {
}

很多时候，我们需要向showStartDate中传入参数

这个时候，我们有两种做法

方法a：

$('#startDateID').bind('click', function(event) {
starD.showStartDate(你要的参数);
});

方法b：

$('#startDateID').bind('click', {arg1: 'test'},starD.showStartDate);

showStartDate: function (event) {
event.data.arg1使用！

}

4、string对象转化为时间对象

var s = '2014-2-12' //这个ie和ff不支持

var t = new Date(s)

s = '2014/2/12' //ie ff chrome都支持

或者new Date('2014','2','12') 也是对各个浏览器兼容的

5、判断浏览器的版本：

保存这篇解释以备不时之需:

除IE外都可识别

项目范例说明![if !IE]The NOT operator. This is placed immediately in front of the feature, operator, or subexpression to reverse the Boolean meaning of the expression.
NOT运算符。这是摆立即在前面的功能，操作员，或子表达式扭转布尔表达式的意义。lt[if lt IE 5.5]The less-than operator. Returns true if the first argument is less than the second argument.
小于运算符。如果第一个参数小于第二个参数，则返回true。lte[if lte IE 6]The less-than or equal operator. Returns true if the first argument is less than or equal to the second argument.
小于或等于运算。如果第一个参数是小于或等于第二个参数，则返回true。gt[if gt IE 5]The greater-than operator. Returns true if the first argument is greater than the second argument.
大于运算符。如果第一个参数大于第二个参数，则返回true。gte[if gte IE 7]The greater-than or equal operator. Returns true if the first argument is greater than or equal to the second argument.
大于或等于运算。如果第一个参数是大于或等于第二个参数，则返回true。( )[if !(IE 7)]Subexpression operators. Used in conjunction with boolean operators to create more complex expressions.
子表达式运营商。在与布尔运算符用于创建更复杂的表达式。&[if (gt IE 5)&(lt IE 7)]The AND operator. Returns true if all subexpressions evaluate to true
AND运算符。如果所有的子表达式计算结果为true，返回true|[if (IE 6)|(IE 7)]The OR operator. Returns true if any of the subexpressions evaluates to true.
OR运算符。返回true，如果子表达式计算结果为true。

7、jQuery不支持json跟string的转换

可以使用json2.js的js库，排除在没必要使用的时候，就不引入

if(typeof(JSON) == "undefined"){
$.getScript('json2.js', function(){
t = JSON.stringify(s);
});
} else{
t = JSON.stringify(s);
}

8、逗号运算符：

在很多场景中，我们会用到这样的方法：

return a,b;

这个表达式，是无论如何都返回b的。

但是a是被执行的！

也就是说，retuan a(),b;

很多时候，我们虽然需要返回的b值，这样同时a函数也被执行了。

是一种比较装B的写法- 。-

9、

jQuery判断ie浏览器的类型：

在jQuery版本1.9.1之后，已经移除了$.browser 和 $.browser.version

取而代之的是 $.support 。在更新的 2.0 版本中，将不再支持 IE 6/7/8。以后，如果用户需要支持 IE 6/7/8，只能使用 jQuery 1.9。如果要全面支持 IE，并混合使用 jQuery 1.9 和 2.0，官方的解决方案是：

<!--[if lt IE 9]>    <script src='jquery-1.9.0.js'></script><![endif]--><!--[if gte IE 9]>    <script src='jquery-2.0.0.js'></script><![endif]-->

从长久来看，这样有利于在复杂情况下根据浏览器特性进行分别处理，而不是简单的检测浏览器类型和版本。但目前很多旧程序的移植恐怕无法直接过渡为根据浏览器支持特性，所以在网上找了一些能够直接替换的解决办法。

这个是手动去解析浏览器类型的方法：

$.browser.mozilla = /firefox/.test(navigator.userAgent.toLowerCase());$.browser.webkit = /webkit/.test(navigator.userAgent.toLowerCase());$.browser.opera = /opera/.test(navigator.userAgent.toLowerCase());$.browser.msie = /msie/.test(navigator.userAgent.toLowerCase());

检查是否为 IE 6-8：

if (!$.support.leadingWhitespace) {}

10、

使用jQuery手动封装mask和unmask浮层方法：

//$.extend($.fn, {//    mask: function (msg, maskDivClass) {//        this.unmask();//        var op = {//            opacity: 0.8,//            z: 10000,//            bgcolor: '#ccc'//        };//        var original = $(document.body);//        var position = { top: 0, left: 0 };//        if (this[0] && this[0] !== window.document) {//            original = this;//            position = original.position();//        }//        var maskDiv = $('<div class="maskdivgen"> </div>');//        maskDiv.appendTo(original);//        var maskWidth = original.outerWidth();//        if (!maskWidth) {//            maskWidth = original.width();//        }//        var maskHeight = original.outerHeight();//        if (!maskHeight) {//            maskHeight = original.height();//        }//        maskDiv.css({//            position: 'absolute',//            top: position.top,//            left: position.left,//            'z-index': op.z,//            width: maskWidth,//            height: maskHeight,//            'background-color': op.bgcolor,//            opacity: 0//        });//        if (msg) {//            var msgDiv = $('<div style="position:absolute;border:#6593cf 1px solid;padding:2px;background:#ccca"><div style="line-height:24px;border:#a3bad9 1px solid;background:white;padding:2px 10px 2px 10px">' + msg + '</div></div>');//            msgDiv.appendTo(maskDiv);//            var widthspace = (maskDiv.width() - msgDiv.width());//            var heightspace = (maskDiv.height() - msgDiv.height());//            msgDiv.css({//                cursor: 'wait',//                top: (heightspace / 2 - 2),//                left: (widthspace / 2 - 2)//            });//        }//        maskDiv.fadeIn('fast', function () {//            $(this).fadeTo('slow', op.opacity);//        })//        return maskDiv;//    },//    unmask: function () {//        var original = $(document.body);//        if (this[0] && this[0] !== window.document) {//            original = $(this[0]);//        }//        original.find("> div.maskdivgen").fadeOut('slow', 0, function () {//            $(this).remove();//        });//    }//});//mash和unmask$.extend($.fn, {    mask: function (content) {        var a = this[0];        if (!a)            return console.log("mask", "the cDom object is empty"), this;        this.unmask();        var b = {};        b.cssText = a.style.cssText;        b.nextSibling = a.nextSibling;        b.parentNode = a.parentNode;        a.style.position = "absolute";        a.style.display = "block";        //        var _ina = document.createElement("container");        //        _ina.style.cssText = "position:absolute;top:0;left:0;width:0;height:0;z-index:100;";        //        var _inb = document.body;        //        _inb || document.write('<span id="__body__" style="display:none;">cQuery</span>');        //        ((_inb = document.body.firstChild) ? document.body.insertBefore(_ina, _inb) : document.body.appendChild(_ina));        //        (_inb = document.getElementById("__body__")) && _inb.parentNode.removeChild(_inb);        //        var _container = $(_ina);        //        _container.append(a);        a.style.left = (document.documentElement.scrollLeft || document.body.scrollLeft || 0) + Math.max(0, (document.documentElement.clientWidth - a.offsetWidth) / 2) + "px";        a.style.top = (document.documentElement.scrollTop || document.body.scrollTop || 0) + Math.max(0, (document.documentElement.clientHeight - a.offsetHeight) / 2) + "px";        var c = "background:#000;position:absolute;left:0;top:0;width:" + Math.max(document.documentElement.clientWidth, document.documentElement.scrollWidth, document.body.clientWidth, document.body.scrollWidth) + "px;height:" + Math.max(document.documentElement.clientHeight, document.documentElement.scrollHeight, document.body.clientHeight, document.body.scrollHeight) + "px;";        b.maskDiv = document.createElement("div");        b.maskDiv.style.cssText = c + "filter:progid:DXImageTransform.Microsoft.Alpha(opacity=50);opacity:0.5;";        $(b.maskDiv).insertBefore(a);        var isIE = /msie/.test(navigator.userAgent.toLowerCase());         isIE && (b.maskIframe = document.createElement("iframe"), b.maskIframe.style.cssText = c + "filter:progid:DXImageTransform.Microsoft.Alpha(opacity=0);opacity:0;", $(b.maskIframe).insertBefore(b.maskDiv));        this.data("__mask__", b);        return this;    },    unmask: function () {        if (!this[0])            return console.log("mask", "the cDom object is empty"), this;        var a = this.data("__mask__");        a && (this[0].style.cssText = a.cssText, (a.nextSibling ? this.first().insertBefore(a.nextSibling) : this.first().appendTo(a.parentNode)), $(a.maskDiv).remove(), a.maskIframe && $(a.maskIframe).remove(), this.removeData("__mask__"));    }});

0 0