zoukankan      html  css  js  c++  java
  • 分享10个超实用的jQuery代码片段

    日期:2013-7-9  来源:GBin1.com

    分享10个超实用的jQuery代码片段

    jQuery以其强大的功能和简单的使用成为了前端开发者最喜欢的JS类库,在这里我们分享一组实用的jQuery代码片段,希望大家喜欢!

    jQuery平滑回到顶端效果

    $(document).ready(function() {
    
    	$("a.topLink").click(function() {
    		$("html, body").animate({
    			scrollTop: $($(this).attr("href")).offset().top + "px"
    		}, {
    			duration: 500,
    			easing: "swing"
    		});
    		return false;
    	});
    
    });

    运行代码:

    GBdebug在线调试地址:http://www.gbin1.com/gb/debug/20864b59-a995-4318-a242-b3038f83f2c3.htm

    jQuery处理图片尺寸

    $(window).bind("load", function() {
    	// 图片修改大小
    	$('#imglist img').each(function() {
    		var maxWidth = 120;
    		var maxHeight = 120;
    		var ratio = 0;
    		var width = $(this).width();
    		var height = $(this).height();
    	
    		if(width > maxWidth){
    			ratio = maxWidth / width;
    			$(this).css("width", maxWidth);
    			$(this).css("height", height * ratio);
    			height = height * ratio;
    		}
          
    		if(height > maxHeight){
    			ratio = maxHeight / height;
    			$(this).css("height", maxHeight);
    			$(this).css("width", width * ratio);
    			width = width * ratio;
    		}
    	});
    
    });
    

    运行代码:

    GBdebug在线调试地址:http://www.gbin1.com/gb/debug/5a2271a5-f363-4b34-8d2f-f0ad03121ced.htm

    jQuery实现的滚动自动加载代码

    var loading = false;
    $(window).scroll(function(){
    	if((($(window).scrollTop()+$(window).height())+250)>=$(document).height()){
    		if(loading == false){
    			loading = true;
    			$('#loadingbar').css("display","block");
    			$.get("load.php?start="+$('#loaded_max').val(), function(loaded){
    				$('body').append(loaded);
    				$('#loaded_max').val(parseInt($('#loaded_max').val())+50);
    				$('#loadingbar').css("display","none");
    				loading = false;
    			});
    		}
    	}
    });
    
    $(document).ready(function() {
    	$('#loaded_max').val(50);
    });
    

    jQuery测试密码强度

    $('#pass').keyup(function(e) {
         var strongRegex = new RegExp("^(?=.{8,})(?=.*[A-Z])(?=.*[a-z])(?=.*[0-9])(?=.*W).*$", "g");
         var mediumRegex = new RegExp("^(?=.{7,})(((?=.*[A-Z])(?=.*[a-z]))|((?=.*[A-Z])(?=.*[0-9]))|((?=.*[a-z])(?=.*[0-9]))).*$", "g");
         var enoughRegex = new RegExp("(?=.{6,}).*", "g");
         if (false == enoughRegex.test($(this).val())) {
                 $('#passstrength').html('More Characters');
         } else if (strongRegex.test($(this).val())) {
                 $('#passstrength').className = 'ok';
                 $('#passstrength').html('Strong!');
         } else if (mediumRegex.test($(this).val())) {
                 $('#passstrength').className = 'alert';
                 $('#passstrength').html('Medium!');
         }
    ........
    GBdebug在线调试地址:http://www.gbin1.com/gb/debug/b1a87e30-e33f-4369-92fc-55e8fd628816.htm 
    

    希望大家喜欢这些实用的jQuery代码,如果你也有更多的jQuery代码片段,请与我们分享,谢谢!

    via 极客社区

    来源:分享10个超实用的jQuery代码片段

  • 相关阅读:
    截取文件路径组成新文件路径
    jsoup选择器
    正则小示例
    一个没有经过优化的过滤指定目录下的指定扩展名文件的算法
    正则表达式生成问题
    链接中带换行的页面查找替换问题
    数组扩容测试
    LeetCode 3.无重复字符的最长子串
    LeetCode 200.岛屿数量
    LeetCode 560.和为K的子数组
  • 原文地址:https://www.cnblogs.com/java20130725/p/3215514.html
Copyright © 2011-2022 走看看