jQuery的实用技巧
1.禁用页面的右键菜单
$(document).ready(function(){ $(document).bind("contextmenu",function(e){ return false; }) });
2.新窗口打开页面
$(document).ready(function(){ //例子1:href="http://"的超链接将会在新窗口打开连接 $("a[href^='http://']").attr("target","_blank"); //例子2:rel="external"的超链接将会在新窗口中打开连接 $("a[rel$='external']").click(function(){ this.target="_blank"; }) }) //use <a href="http://www.cssrain.cn" rel="external">open link</a>
3.输入框文字获取和失去焦点
$(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); } }); }
4.获取鼠标位置
$(document).ready(function(){ $(document).mousemove(function(e){ $("#XY").html("X:" + e.pageX + "| Y:" +e.pageY); }); });
5.点击div也可以跳转
$("div").click(function(){ window.location=$(this).find("a").attr("href"); return false; }); //user <div><a href="index.html">home</a></div>
6.根据浏览器大小添加不同的样式
$(document).ready(function(){ function checkWindowSize(){ if($(window).width() > 1200){ $("body").addClass("large"); }else{ $("body").removeClass("large"); } } $(window).resize(checkWindowSize) });
7.关闭所有动画效果
$(document).ready(function(){ jQuery.fx.off = true; });
8.检测鼠标按键
$(document).ready(function(){ $("#XY").mousedown(function(e){ alert(e.which) //1:鼠标左键;2:鼠标中键;3:鼠标右键 }) });