积累的一些代码片段/小知识

★jQuery1.7.2下操作object元素报错

jQuery1.7.2下，用$选择器操作object元素会报错：代码如下：

$('object').hide();

换用原生js就没事了：

document.getElementsByTagName('object')[0].style.display = 'none';

 

★关闭按钮小叉的字体

做一个简单的关闭按钮时，我们经常用字母X来实现，为了让它看上去更像一个叉，可设置字体为：

font-family: “Microsoft JhengHei”,”microsoft yahei”,Monaco,Menlo,Consolas,”Courier New”,monospace;

 

★this 的值是在函数运行时确定的

<button id="btn1">button1</button>
<button id="btn2">button2</button>
var obj = {
    init : function(){
        $('#btn1').click(this.alert);
    },
    init2 : function(){
        var _this = this;
        $('#btn2').click(function(){
            _this.alert();
        });
    },
    alert : function(){
        alert(this);
    }
}
         
obj.init();
obj.init2();

 

★使用正则实现数字千分位分割

不带小数点的：

"15000000".split("").reverse().join("").replace(/(\d{3})/g, "$1,").split("").reverse().join("");

带小数点的：

'123123211312.333123'.replace(/(?=(?!^)(?:\d{3})+(?:\.|$))(\d{3}(\.\d+$)?)/g,',$1');

 

★背景半透明，内容不透明的写法

<div><p>不透明</p></div>
div{background:rgba(0,0,0,0.2) none repeat scroll !important; /*实现FF背景透明，文字不透明*/
background:#000; filter:Alpha(opacity=20);/*实现IE背景透明*/
width:500px; height:500px; color:#F30; font-size:32px; font-weight:bold;}
div p{ position:relative;}/*实现IE文字不透明*/

火狐我们直接用rgba颜色就可以解决子标签跟着半透明的问题了，但是ie还不是能很好的支持。

所以我们给不想被透明的标签设置一个定位属性，问题接能解决了。

 

★为div元素触发keydown事件

div元素无法触发keydown的原因是图无法被focus，处理的方式是给div加上属性tabindex就可以了。tabindex的取值为整数，表示按tab键的时候元素获得焦点的顺序。当取值为-1时，按tab无法获得焦点，但可以用js代码来focus和blur，同时，还是可以触发keydown事件的。

所以要让div能触发keydown事件，只需如下代码：

<div tabindex="-1">hello world !</div>

加此属性后div会有高亮外框出现，加outline:none;可解决。

 

★查询url中的参数

function getParameterByName(name) {
    var match = RegExp('[?&]' + name + '=([^&]*)')
                    .exec(window.location.search);
    return match && decodeURIComponent(match[1].replace(/\+/g, ' '));
}

 

★移动端，绑定了click事件的元素在点击时会出现亮框，下面的代码可以去掉：

-webkit-tap-highlight-color:rgba(0,0,0,0);
-webkit-tap-highlight-color: transparent; /* For some Androids */