jquery常用代码集锦

时间:2022-07-20 13:04:23

1. 如何修改jquery默认编码(例如默认GB2312改成 UTF-8 )

1
2
3
4
5
$.ajaxSetup({
    ajaxSettings : {
        contentType : "application/x-www-form-urlencoded;chartset=UTF-8"
    }
});

2. jquery判断元素上是否绑定了事件

1
2
3
4
5
//jQuery event封装支持判断元素上是否绑定了事件,此方法只适用于jQuery绑定的事件
var $events = $("#id").data("events");
if ($events && $events["click"]) {
 // your code
}

3. 被选中的option元素

1
$('#element').find('option:selected');

4. 禁用右键单击上下文菜单

1
2
3
$(document).bind("contextmenu",function(e){
    return false;
});

5. 禁用文本选择功能

1
2
3
$(document).bind("selectstart", function() {
    return false;
});

6. jquery隔行换色

1
2
$(".div_row1:even").addClass("background_even"); // 匹配偶数行
$(".div_row1:odd").addClass("background_odd"); // 匹配单数行

7. 鼠标移入变色,移除还原背景色

1
2
3
4
5
$(".div_row1").mouseover(function() {
    $(this).addClass("background_mouseover");
}).mouseout(function() {
    $(this).removeClass("background_mouseover");
});

8. jquery判断鼠标左键、右键

1
2
3
4
5
6
7
$("#id").mousedown(function(e) {
    if (3 == e.which) {
        alert("右键单击事件");
    } else if (1 == e.which) {
        alert("左键单击事件");
    }
});

9.jquery动态添加元素到DOM中

1
2
var newDiv = $('<div></div>');
newDiv.attr('id', 'myNewDiv').appendTo('body');

10.jquery元素居中(屏幕正中间)

1
2
3
4
5
6
7
8
jQuery.fn.center = function () {
return this.each(function(){
$(this).css({
position:'absolute',
top, ( $(window).height() - this.height() ) / 2 + $(window).scrollTop() + 'px',
left, ( $(window).width() - this.width() ) / 2 + $(window).scrollLeft() + 'px'     });
});
}// 这样来使用上面的函数: $(element).center();

11. 把特定名称的所有元素的值都放到一个数组中

1
2
3
4
var arr = new Array();
$("input[name='xxx']").each(function(){
arr.push($(this).val());
});

12. jquery正则表达式除去HTML标签

1
2
3
4
5
6
7
8
9
(function($) {
$.fn.stripHtml = function() {
var regexp = /<("[^"]*"|'[^']*'|[^'">])*>/gi;
this.each(function() {
$(this).html( $(this).html().replace(regexp,'') );
});
return $(this);
}
})(jQuery); // 用法: $('p').stripHtml();

13.jquery获得鼠标光标位置x和y

1
2
3
4
5
$(document).ready(function() {
$(document).mousemove(function(e) {
        $("#mouse").html("X point : " + e.pageX + " | Y  " + e.pageY);
    });
});

14.jquery检查元素是否存在

1
2
3
if ( $("#id").length > 0 ) {
    // it exists
}

15.js倒计时

1
2
3
4
5
6
7
8
9
var count = 5;
countdown = setInterval(function() {
    $("#mouse").html(count + " 秒后将跳转到百度首页!");
    if (count == 0) {
        clearInterval(countdown);
        window.location = 'http://www.baidu.com';
        }
    count--;
}, 1000);

16.jquery回到顶部

1
2
3
4
5
6
7
8
9
jQuery.fn.autoscrolltoTop = function() {
    $('html,body').animate({
            scrollTop: this.offset().top
        },
        500
    );
};
// 执行如下代码开始滚动
$('#footer').autoscrolltoTop();

当然除了这些,还有更多常用的jquery代码等着大家去发掘。

原创文章,转载请注明: 转载自java开发者

本文链接地址: jquery常用代码集锦