常用jquery小结
1.改变字体大小
$(function (){ //得到当前的size var originalFontSize=$('html').css('font-size'); //增加size $(".increase").click(function (){ var currentSize=$('html').css('font-size'); var currentSize=parseFloat(currentSize,10); var newSize=currentSize*1.2; $('html').css('font-size',newSize); return false; }) //减少 $(".decrease").click(function (){ var currentSize=$('html').css('font-size'); var currentSize=parseFloat(currentSize,10); var newSize=currentSize*0.8; $('html').css('font-size',newSize); return false; }) //重置 $(".resetFone").click(function (){ $('html').css('font-size',originalFontSize); }); })
2.在新窗口中打开连接
$("a[href^='http']").attr("target","_blank");
3.互换样式表
$('link[rel=stylesheet]').attr('href',$(this).attr('rel'));
4.禁用右键
$(document).bind("contextmenu",function (e){ return false; });
5.使用siblings()来处理同类元素
$("#nav li").click(function (){ $("#nav li").removeClass('active'); $(this).addClass('active');; }) //优化方案 $('#nav li').click(function (){ $(this).addClass('active').siblings().removeClass('active'); })
6.全选后不全选
var tag=false; $('#btn').click(function (){ //建议使用prop $('input[type="checked"]').attr("checked",!tag); tag=!tag; })
7.jquery中proxy的使用
//this的正常使用 $('#btn').click(function (){ var val=this.value; $(this).addClass('className'); }) //非期望的值(this) $('#btn').click(function (){ setTimeout(function (){ $(this).addClss('className'); },1000) }) //改进; $('#btn').click(function (){ var oThis=this; setTimeout(function (){ $(oThis).addClss('className'); },1000) }) /*也可以使用我们jQuery 中的proxy jQuery.proxy(function,context); function 将要改变上下文语境的函数 context 函数上下文语静(this)会被设置成这个object对象 jQuery.proxy(context,name); context函数的上下文语境会被设置成这个object对象。 name 将要改变上下文的函数名称 */ $('#btn').click(function (){ setTimeout($.proxy(function (){ $(this).addClass('className') },this),1000) })