【jQuery基础】代码片段

内容简介:本文收集了常用的jQuery代码片段

*取消请求

var xhr = $.ajax({});
//取消请求
xhr.abort()
View Code

*阻止鼠标右键

$(document).on("contextmenu",function() {
    return false;
});
View Code

*回到顶部

$(‘body,html‘).animate({scrollTop:0},500);
View Code

*获取鼠标坐标

$().mousemove(function(e){
    alert(e.pageX +"|"+ e.pageY);
});
View Code

*选择不包含某个class的元素

$("div:not(.class1)")
View Code

*选择包含某个class的元素

$("div:has(.class1)")
View Code

*浏览器检测

if($.browser.msie){} //IE系列
if($.browser.safari){} //safari
if($.browser.mozilla){} //FF
if($.browser.msie && $.browser.version > 6 ){} //IE6+
if($.browser.msie && $.browser.version <= 6 ){} //IE6和IE6-
View Code

*标签替换

$(‘.test‘).replaceWith(‘<h2>替换</h2>‘)
View Code

*图片预加载

function preloadImages() {
    for(var i = 0; i < arguments.length; i++) {
        $("<img />").attr(‘src‘, arguments[i]);
    }
}

preloadImages(‘image1.gif‘, ‘image2.jpg‘);
View Code

*获取选中的select项

$(‘obj option:selected‘)
View Code

*选中包含某文本的元素

$(‘obj:contains("txt")‘
View Code

*滚动到某区域

function autoscroll(selector) {
    $(‘html,body‘).animate({
        scrollTop: $(selector).offset().top
    },500};
}
View Code

*某元素是否存在

if($(obj).length){}
View Code

*检测鼠标左右键

$(obj).on(‘click‘, function(e) {
    if( (!$.browser.msie && e.button == 0) || ($.browser.msie && e.button == 1) ) {
        alert("Left Mouse Button Clicked");
    } else if(e.button == 2) {
        alert("Right Mouse Button Clicked");
    }
});
View Code

*限制textarea字符个数

jQuery.fn.maxLength = function(max){
    this.each(function(){
        var type = this.tagName.toLowerCase();
        var inputType = this.type? this.type.toLowerCase() : null;
        if(type == "input" && inputType == "text" || inputType == "password"){
            //Apply the standard maxLength
            this.maxLength = max;
        }
        else if(type == "textarea"){
            this.onkeypress = function(e){
                var ob = e || event;
                var keyCode = ob.keyCode;
                var hasSelection = document.selection? document.selection.createRange().text.length > 0 : this.selectionStart != this.selectionEnd;
                return !(this.value.length >= max && (keyCode > 50 || keyCode == 32 || keyCode == 0 || keyCode == 13) && !ob.ctrlKey && !ob.altKey && !hasSelection);
            };
            this.onkeyup = function(){
                if(this.value.length > max){
                    this.value = this.value.substring(0,max);
                }
            };
        }
    });
};
View Code

*元素是否可见

if($(obj).is(‘:visible‘)){}
View Code

*居中

jQuery.fn.center = function () {
    this.css(‘position‘,‘absolute‘);
    this.css(‘top‘, ( $(window).height() - this.height() ) / +$(window).scrollTop() + ‘px‘);
    this.css(‘left‘, ( $(window).width() - this.width() ) / 2+$(window).scrollLeft() + ‘px‘);
    return this;
};
View Code

*去除html标签

(function($) {
    $.fn.stripHtml = function() {
        var regexp = /<("[^"]*"|‘[^‘]*‘|[^‘">])*>/gi;
        this.each(function() {
            $(this).html( $(this).html().replace(regexp,"") );
        });
        return $(this);
    }
})(jQuery);
View Code

*基于文本过滤元素

$(obj).filter(function(){
    return $(this).val() == 1;
});
View Code

*图像是否已加载

$(obj).attr(‘src‘, ‘img.jpg‘).load(function(){
    alert(‘over!‘);
});
View Code

【jQuery基础】代码片段,古老的榕树,5-wow.com

郑重声明:本站内容如果来自互联网及其他传播媒体,其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享,并不代表本站赞同其观点和对其真实性负责,也不构成任何其他建议。