Jquery技巧

1、禁用页面的右键菜单

$(document).ready(function(){
　　$(document).bind("contextmenu",function(e){
　　　　return false;
　　 });
 });

2、新窗口打开页面

$(document).ready(function(){
　　$('a[href^="http://"]').attr("target","_blank");
　　$("a[rel$='external']").click(function(){
　　　　this.tatget="_blank";
　　  });
 　　});
<a href="http://" rel="external">open link</a>

3、判断浏览器类型

$(document).ready(function(){
//FireFox 2 and above
　　　　if( $.browser.mozilla && $.browser.verdion >= "1.8"){
　　　　　　//do nothing
　　　　　　}
//Safari
　　　　if( $.browser.safari){
　　　　　　//do nothing
　　　　　　}
//Chrome
　　　　if( $.browser.chrome){
　　　　　　//do nothing
　　　　　　}
//Opera
　　　　if( $.browser.opera){
　　　　　　//do nothing
　　　　　　}
//IE6 and below
　　　　if( $.browser.msie && $.browser.version <= 6){
　　　　　　//do nothing
　　　　　　}
//anything above IE6
　　　　if( $.browser.msie && $.browser.version > 6){
　　　　　　//do nothing
　　　　　　}
});

4、输入框文字获取和失去焦点

$(document).ready(function(){
    $("input.text1").val("Enter your search text here");
    textFill($('input.text1'));
});
function textFill(input){
    var originalvalue = input.val();
    input.focus( function(){
       if( $.trim(input.val()) == originalvalue){
　　　　　　input.val(' ');
　　　　　　} 
}).blur(function(){
　　　　if( $.trim(input.val()) == ' '){
　　　　　　input.val(originalvalue);
　　　　　　}   
});
}

5、返回头部滑动动画

jQuery.fn.scrollTo=function(speed){
　　var targetOffset=$(this).offset().top;
　　$('html.body').stop().animate({scrollTop: targetOffset}.speed);
　　return this;
};

$("#goheader").click(function(){
　　$("body").scrollTo(500);
　　return false;
});

6、获取鼠标位置

$(document).ready(function(){
　　$(document).mousemove(function(e){
　　　　$('#XY').html("X: " + e.pageX +" | Y : " + e.pageY);
　　});
});

7、设置div在屏幕中央

$(document).ready(function(){
jQuery.fn.center = function(){
this.css("position","absolute");
this.css("top",($(window).height() - this.height() ) / 2+$(window).scrollTop() + "px");
this.css("left",($(window).width() - this.width() ) / 2+$(window).scrollLeft() + "px");
return this;
}

$("#XY").center();
});

8、检测鼠标左右键

$(document).ready(function(){
　　$("#XY").mousedown(function(e){
　　　　alert(e.which) 
　　})
});

9、使用siblings来选择同辈元素

$('#nav li').click(function(){
　　　　$(this).addClass('active').sibilings().removeClass('active');
});

10、在一段时间后自动隐藏或关闭元素

$("div").slideUp(300).delay(3000).fadeIn(400);

 

转载于:https://www.cnblogs.com/danznb/p/3504480.html