分享jQuery封装好的一些常用操作
2024-10-18 19:21:51
1. 禁止右键点击
$(document).ready(function(){ $(document).bind("contextmenu",function(e){ return false; });});2. 隐藏搜索文本框文字
$(document).ready(function() {$("input.text1").val("Enter your search text here"); textFill($('input.text1'));}); function textFill(input){ //input focus text function 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.在新窗口中打开链接
$(document).ready(function() { //Example 1: Every link will open in a new window //Example 2: Links with the rel="external" attribute will only open in a new window $('a[@rel$='external']').click(function(){ this.target = "_blank"; });});// how to use4. 检测浏览器
$(document).ready(function() {// Target Firefox 2 and aboveif ($.browser.mozilla && $.browser.version >= "1.8" ){ // do something}// Target Safariif( $.browser.safari ){ // do something}// Target Chromeif( $.browser.chrome){ // do something}// Target Caminoif( $.browser.camino){ // do something}// Target Operaif( $.browser.opera){ // do something}// Target IE6 and belowif ($.browser.msie && $.browser.version <= 6 ){ // do something}// Target anything above IE6if ($.browser.msie && $.browser.version > 6){ // do something}});5. 预加载图片
$(document).ready(function() {jQuery.preloadImages = function(){ for(var i = 0; i<ARGUMENTS.LENGTH; jQuery(?<img { i++)>").attr("src", arguments[i]); }}// how to use$.preloadImages("image1.jpg");});6. 返回页面顶部功能
$(document).ready(function() {$('a[href*=#]').click(function() {if (location.pathname.replace(/^//,'') == this.pathname.replace(/^//,'')&& location.hostname == this.hostname) { var $target = $(this.hash); $target = $target.length && $target || $('[name=' + this.hash.slice(1) +']'); if ($target.length) { var targetOffset = $target.offset().top; $('html,body') .animate({scrollTop: targetOffset}, 900); return false; } } });// how to use// place this where you want to scroll to<A name=top></A>// the link<A href="#top">go to top</A>});7. 获得鼠标指针XY值
$(document).ready(function() { $().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); });// how to use<DIV id=XY></DIV>});8.检查图片是否加载完成
有时候你需要确保图片完成加载完成以便执行后面的操作：$('img').load(function () { console.log('image load successful');});9.自动修改破损图像
如果你碰巧在你的网站上发现了破碎的图像链接，你可以用一个不易被替换的图像来代替它们。添加这个简单的代码可以节省很多麻烦：
如果你碰巧在你的网站上发现了破碎的图像链接，你可以用一个不易被替换的图像来代替它们。添加这个简单的代码可以节省很多麻烦：
$('img').on('error', function () { $(this).prop('src', 'img/broken.png');});10. jQuery延时加载功能
$(document).ready(function() { window.setTimeout(function() { // do something }, 1000);});最新文章
- HTML5学习小结
- hdu 2079
- Leetcode028. Implement strStr()
- UVALive4513 Stammering Aliens（哈希法，后缀数组）
- JavaScript Date 时间对象方法
- error: No rule to make target '/usr/lib/libOpenNI.so', needed by 'bin/euroc_rectify'。 停止。
- es某个分片受损或卡在INITIALIZING状态时解决办法
- Java 过滤特殊字符的 正则表达式
- solr入门之搜索建议的几种实现方式和最终选取实现思路
- 最长公共子序列&最长公共子串
- mongodb 安装（windows mongodb 安装）
- U3D 场景切换时 脚本对象,GO对象，资源对象的问题
- 如何彻底删除TFS的工作项字段
- Introducing my blog
- .Net Excel 导出图表Demo(柱状图，多标签页) .net工具类 分享一个简单的随机分红包的实现方式
- CodeForces 814D An overnight dance in discotheque（贪心+dfs）
- Steamworks and Unity – P2P多人游戏
- 使用HibernateTemplate手写源生SQL的【增删改查】 操作
- testng失败重跑
- ROS 负载均衡