29. 如何为函数创建一个基本的测试
1 2 3 4 5 6 7 8 9 | module("Module B");
test("some other test", function() {
expect(2);
equals( true, false, "failing test" );
equals( true, true, "passing test" );
});
|
30. 如何在jQuery中克隆一个元素：
1 | var cloned = $('#somediv').clone();
|
31. 在jQuery中如何测试某个元素是否可见
1 2 3 | if($(element).is(':visible') == 'true') {
}
|
32. 如何把一个元素放在屏幕的中心位置：
1 2 3 4 5 6 7 8 | 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;
}
$(element).center();
|
33. 如何把有着某个特定名称的所有元素的值都放到一个数组中：
1 2 3 4 | var arrInputValues = new Array();
$("input[name='table[]']").each(function(){
arrInputValues.push($(this).val());
});
|
34. 如何从元素中除去html
1 2 3 4 5 6 7 8 9 10 11 | (function($) {
$.fn.stripHtml = function() {
var regexp = /<("[^"]*"|'[^']*'|[^'">])*>/gi;
this.each(function() {
$(this).html( $(this).html().replace(regexp,”") );
});
return $(this);
}
})(jQuery);
$('p').stripHtml();
|
35. 如何使用closest来取得父元素：
1 | $('#searchBox').closest('div');
|
36. 如何使用Firebug和Firefox来记录jQuery事件日志：
1 2 3 4 5 6 7 8 9 | $('#someDiv').hide().log('div hidden').addClass('someClass');
jQuery.log = jQuery.fn.log = function (msg) {
if (console){
console.log("%s: %o", msg, this);
}
return this;
};
|
37. 如何强制在弹出窗口中打开链接：
1 2 3 4 5 6 7 | jQuery('a.popup').live('click', function(){
newwindow=window.open($(this).attr('href'),'','height=200,width=150');
if (window.focus) {
newwindow.focus();
}
return false;
});
|
38. 如何强制在新的选项卡中打开链接：
1 2 3 4 5 | jQuery('a.newTab').live('click', function(){
newwindow=window.open($(this).href);
jQuery(this).target = "_blank";
return false;
});
|
39. 在jQuery中如何使用.siblings()来选择同辈元素
1 2 3 4 5 6 7 8 9 | $('#nav li').click(function(){
$('#nav li').removeClass('active');
$(this).addClass('active');
});
$('#nav li').click(function(){
$(this).addClass('active').siblings().removeClass('active');
});
|
40. 如何切换页面上的所有复选框：
1 2 3 4 5 6 | var tog = false;
$('a').click(function() {
$("input[type=checkbox]").attr("checked",!tog);
tog = !tog;
});
|
41. 如何基于一些输入文本来过滤一个元素列表：
1 2 3 4 5 | $('.someClass').filter(function() {
return $(this).attr('value') == $('input#someId').val();
})
|
42. 如何获得鼠标垫光标位置x和y
1 2 3 4 5 | $(document).ready(function() {
$(document).mousemove(function(e){
$(’#XY’).html(”X Axis : ” + e.pageX + ” | Y Axis ” + e.pageY);
});
});
|
43. 如何把整个的列表元素（List Element，LI）变成可点击的
1 2 3 4 | $("ul li").click(function(){
window.location=$(this).find("a").attr("href");
return false;
});
|
1 2 3 4 5 6 | <ul>
<li><a href="#">Link 1</a></li>
<li><a href="#">Link 2</a></li>
<li><a href="#">Link 3</a></li>
<li><a href="#">Link 4</a></li>
</ul>
|
44. 如何使用jQuery来解析XML（基本的例子）：
1 2 3 4 5 6 | function parseXml(xml) {
$(xml).find("Tutorial").each(function() {
$("#output").append($(this).attr("author") + "");
});
}
|
45. 如何检查图像是否已经被完全加载进来
1 2 3 | $('#theImage').attr('src', 'image.jpg').load(function() {
alert('This Image Has Been Loaded');
});
|
46. 如何使用jQuery来为事件指定命名空间：
1 2 3 4 5 6 | $('input').bind('blur.validation', function(e){
});
$('input').data('validation.isValid', true);
|
47. 如何检查cookie是否启用
1 2 3 4 5 6 7 | var dt = new Date();
dt.setSeconds(dt.getSeconds() + 60);
document.cookie = "cookietest=1; expires=" + dt.toGMTString();
var cookiesEnabled = document.cookie.indexOf("cookietest=") != -1;
if(!cookiesEnabled) {
}
|
48. 如何让cookie过期：
1 2 3 | var date = new Date();
date.setTime(date.getTime() + (x * 60 * 1000));
$.cookie('example', 'foo', { expires: date });
|
49. 如何使用一个可点击的链接来替换页面中任何的URL
1 2 3 4 5 6 7 8 9 10 11 | $.fn.replaceUrl = function() {
var regexp = /((ftp|http|https):\/\/(\w+:{0,1}\w*@)?(\S+)(:[0-9]+)?(\/|\/([\w#!:.?+=&%@!\-\/]))?)/gi;
this.each(function() {
$(this).html(
$(this).html().replace(regexp,'<a href="$1">$1</a>‘)
);
});
return $(this);
}
//用法
$('p').replaceUrl();
|
Source: | 