jQuery 一些方法技巧

来源：互联网发布：淘宝美工助理激活卡号编辑：程序博客网时间：2024/06/07 17:20
//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();});
原文地址 jquery http://www.jqueryba.com/170.html
0 0