简单其实不简单

在页面中加载jQuery

又是N久没更新过了，懒啊！

常要测试些代码，又或者要对页面中做些操作，但发现页面中没有引入jQuery，今天写了个简单的东西让页面方便快速的加载jQuery

方法很简单将下面的链接拖到你的收藏夹中就可以了，以后想要在当前页面加载jQuery，直接按一下就可以了，如果页面中已经加载了jquery则不会去加载并且显示当前jQuery的版本。

灵感来源由Firefox的一个插件fireQuery，但它只能在FF下使用。

• load jQuery

代码也没什么，放这了，别见笑：

(function(window, document, undefined){
    var div = document.createElement('div')
        , body = document.getElementsByTagName('body')[0];
    if(window.jQuery === undefined){
        var ga=document.createElement('script');
        ga.type='text/javascript';
        ga.async=true;
        ga.src='https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js';
        body.insertBefore(ga, body.firstChild);
        if (ga.addEventListener) {
            ga.addEventListener('load', callback, false);
        } else { // for IE6-8
            ga.attachEvent('onreadystatechange', function() {
                var rs = ga.readyState;
                if (rs === 'loaded' || rs === 'complete') {
                    callback();
                }
            });
        }
    } else {
        callback();
    }

    function callback(){
        div.innerHTML = '<div style="font:700 40px/46px Arial,Verdana;position:fixed;padding:5px 10px;margin:0;z-index:1001;color:#444; background-color:#FFFB00;opacity:0.8;">This page already using jQuery v'+ jQuery.fn.jquery +'</div>';
        var el = div.firstChild;
        body.appendChild(el);
        el.style.left = Math.floor(((window.innerWidth || document.documentElement.clientWidth) - el.clientWidth) / 2) + 'px';
        el.style.top = Math.floor(((window.innerHeight || document.documentElement.clientHeight) - el.clientHeight) / 2) + 'px';
        setTimeout(function(){
            body.removeChild(el);
        },3000);
    }
})(window, document)

input只能输入数字的方法

昨天写后台的表单时的需求，发现自己对这方面的了解很不够，在网友steven_2005的这博文中的实现方式不错，但和我的需求还差一点，所以改进了下（一个输入字符不能是小数点）：

// input只能输入数字和小数点
function DigitInput(el,e) {
    //8：退格键、46：delete、37-40： 方向键
    //48-57：小键盘区的数字、96-105：主键盘区的数字
    //110、190：小键盘区和主键盘区的小数
    //189、109：小键盘区和主键盘区的负号
    var e = e || window.event; //IE、FF下获取事件对象
    var cod = e.charCode||e.keyCode; //IE、FF下获取键盘码
    //小数点处理
    if (cod == 110 || cod == 190){
        (el.value.indexOf(".")>=0 || !el.value.length) && notValue(e);
    } else {
        if(cod!=8 && cod != 46 && (cod<37 || cod>40) && (cod<48 || cod>57) && (cod<96 || cod>105)) notValue(e);
    }
    function notValue(e){
        e.preventDefault ? e.preventDefault() : e.returnValue=false;
    }
}

使用方式很简单，要注意的是函数得绑定在onKeydown事件上：

<input type="text" onkeydown = "DigitInput(this,e);" />

或用事件绑定的方式（jQuery的代码）：

$('input').bind('keydown', function(e){
    DigitInput(this, e);
});

速记: jQuery两DOM比较

今天在写基于jQuery的一项目时遇到的问题，先看代码：

var a = $('#sR_Tab');
var b = $('#sR_Tab');
console.log(a == b);   // return false

看到测试返回的值第一时间我感到很差异，但细想下后就明白了，用jQuery有几年了，居然到现在才注意到这问题，失败啊！

在这也给自己理一理吧，再让自己记牢点。

看到上面测试如果还不能想明白的可以测试以下代码：

var a = $('#sR_Tab');
console.log(typeof a);  // return object

结果返回说是Object类型，实际上a是个Array类型的Object，在JS类型中没有这种说法，但切能很让我们很清楚的了解这变量的真正类型，谁叫JS的类型总是含糊不清的。

明白上面的a是个Array类型的Object后就能很好的解释为什么a != b了。在JS的变量中，Array、Object类型的变量其值是指向数据的指针，而非数据本身。而jQuery的$()函数是会返回一个全新的Array类型的Object。所以虽然a、b变量的值是指向不同空间的地址，其值自然不同。

那要如何才能返回真正的比较结果呢？其实jQuery中的$()函数返回的是所选DOM的数组，所以只要得到真正DOM的引用进行比较就能得到我们真正要的比较结果，写法也很简单:

var a = $('#sR_Tab');
var b = $('#sR_Tab');
console.log(a[0] == b[0]);   // return true

呵呵，就这么简单。只是到现在才注意到两jQuery对象比较返回的结果是false让我很郁闷。真郁闷！

jQuery.contains()函数在Firefox下的'bug'

再来写点有关contains的事情，今天做项目时刚好可以用上contains，只是我的项目是基于jQuery的，就使用jQuery内部的jQuery.contains()函数了，但我发现这函数在Firefox有问题。

先看下测试Demo

$(document).ready(function(){
    alert( $.contains($('div.wrap')[0], $('#fdsfafd')[0]) );
    alert(4322);
    $('h1').click(function(){alert(111);});
});

在Firefox下，如果$('#fdsfafd')[0]不存在会导致整个页面的JS锁死，不再会执行任何代码了。

我现在的解决办法是是保证$.contains()中第二个参数存在，代码如下：

alert( $.contains($('div.wrap')[0], $('#fdsfafd')[0]||$('body')[0]) );

方法我知道很淫荡，但先这样了，没时间去改jQuery的内部实现。

JS写的一个切换效果

帮人写的，呵呵！

里面有Ticker、以及lightbox效果，看Demo吧！

用jQuery写的，看着吧！在于如何实现，了解了这个用其它的也都一样了！HTML结构以及CSS可不是我写的，可能用于显现一个Demo有点不适合，看JS就是了，我也尽量让JS与HTML的结构分离了。