jQuery 一些方法技巧

//1. 去除页面的右键菜单
$(document).ready(function() {
$(document).bind("contextmenu", function(e) {
returnfalse;
});
});

//2.当鼠标获得焦点、失去焦点的时候，input输入框文字处理：
$(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("");
}
}
);
input.blur(function(){
if( $.trim(input.val())==""){
input.val(originalvalue);
}
}
);
}

//3、轻松切换css样式
$(document).ready(function(){
$("a.Styleswitcher").click(function(){
//swicth the LINK REL attribute with the value in A REL attribute
$('link[rel=stylesheet]').attr('href', $(this).attr('rel'));
}
);
}
);
// place this in your header
<link rel="stylesheet" href="default.css" type="text/css">
// the links
<a href="#" rel="default.css">Default Theme</a>
<a href="#" class="Styleswitcher" rel="red.css">Red Theme</a>
<a href="#" class="Styleswitcher" rel="blue.css">Blue Theme</a>

//4、高度相等的列
//如果您使用两个CSS列，以此来作为他们完全一样的高度
$(document).ready(function(){
function equalHeight(group){
tallest =0;
group.each(function(){
thisHeight = $(this).height();
if(thisHeight > tallest){
tallest = thisHeight;}
}
);
group.height(tallest);
}
// how to use
$(document).ready(function(){
equalHeight($(".left"));
equalHeight($(".right"));
}
);
}
);

//5、简单字体变大缩小
$(document).ready(function(){
// Reset the font size(back to default)
var originalFontSize = $('html').css('font-size');
$(".resetFont").click(function(){
$('html').css('font-size', originalFontSize);
}
);
// Increase the font size(bigger font0)
$(".increaseFont").click(function(){
var currentFontSize = $('html').css('font-size');
var currentFontSizeNum = parseFloat(currentFontSize,10);
var newFontSize = currentFontSizeNum*1.2;
$('html').css('font-size', newFontSize);
returnfalse;
}
);
// Decrease the font size(smaller font)
$(".decreaseFont").click(function(){
var currentFontSize = $('html').css('font-size');
var currentFontSizeNum = parseFloat(currentFontSize,10);
var newFontSize = currentFontSizeNum*0.8;
$('html').css('font-size', newFontSize);
returnfalse;
}
);

}
);

//6、获取鼠标位置
$().mousemove(function(e){
//display the x and y axis values inside the div with the id XY
$('#XY').html("X Axis : "+ e.pageX+" | Y Axis "+ e.pageY);
}
);

//7、判断一个元素是否为空
if($('#id').html()){
// do something
}

//8、替换元素
$('#id').replaceWith(' <div>I have been replaced</div> ');

//9、判断元素是否存在
$(document).ready(function(){
if($('#id').length){
// do something
}
}
);

//10、关闭jquery动画效果
$(document).ready(function(){
jQuery.fx.off=true;
}
);

//11、使用自己的jquery标识
$(document).ready(function(){
var $jq = jQuery.noConflict();
$jq('#id').show();
}
);

//12、设置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;
};
$("#id").center();
}
);