这些年、我收集的JQuery代码小结(3)


//把测试单独放在模块中
module("Module B");
test("some other test", function () {
//指明测试内部预期有多少要运行的断言
expect(2);
//一个比较断言,相当于JUnit的assertEquals
equals(true, false, "failing test");
equals(true, true, "passing test");
});31. 如何在jQuery中克隆一个元素

var cloned = $('#somediv').clone();


32. 在jQuery中如何测试某个元素是否可见

复制代码 代码如下:


if ($(element).is(':visible') ) {
//该元素是可见的
}


33. 如何把一个元素放在屏幕的中心位置

复制代码 代码如下:


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();


34. 如何把有着某个特定名称的所有元素的值都放到一个数组中

复制代码 代码如下:


var arrInputValues = new Array();
$("input[name='table[]']").each(function () {
arrInputValues.push($(this ).val());
});


35. 如何从元素中除去HTML

复制代码 代码如下:


(function ($) {
$.fn.stripHtml = function () {
var regexp = /<("[^"]*"|'[^']*'|[^'">])*>/gi;
this.each(function () {
$(this).html($(this).html().replace(regexp, ""));
});
return $(this);
}
})(jQuery); //用法: $('p').stripHtml();


36. 如何使用closest来取得父元素

复制代码 代码如下:

$('#searchBox').closest('div');


37. 如何使用Firebug和Firefox来记录jQuery事件日志

复制代码 代码如下:


// 允许链式日志记录
// 用法:
$('#someDiv').hide().log('div hidden').addClass('someClass');
jQuery.log = jQuery.fn.log = function (msg) {
if (console) {
console.log("%s: %o", msg, this);
}
return this;
};


38. 如何强制在弹出窗口中打开链接

复制代码 代码如下:


jQuery('a.popup').live('click', function () {
newwindow = window.open($(this).attr('href'), '', 'height=200,width=150');
if (window.focus) {
newwindow.focus();
} return false;
});


39. 如何强制在新的选项卡中打开链接

复制代码 代码如下:


jQuery('a.newTab').live('click', function () {
newwindow = window.open($(this).href);
jQuery(this).target = "_blank";
return false;
});


40. 在jQuery中如何使用.siblings()来选择同辈元素

复制代码 代码如下:


// 不这样做
$('#nav li').click(function () {
$('#nav li').removeClass('active');
$(this).addClass('active');
}); //替代做法是

$('#nav li').click(function () {
$(this).addClass('active').siblings().removeClass('active');
});


41. 如何切换页面上的所有复选框

复制代码 代码如下:


var tog = false ;
// 或者为true,如果它们在加载时为被选中状态的话

$('a').click(function () {
$("input[type=checkbox]").attr("checked", !tog);
tog = !tog;
});


42. 如何基于一些输入文本来过滤一个元素列表

复制代码 代码如下:


//如果元素的值和输入的文本相匹配的话
//该元素将被返回 $('.someClass').filter(function () {
return $(this).attr('value') == $('input#someId').val();
})


43. 如何获得鼠标垫光标位置x和y

复制代码 代码如下:


$(document).ready(function () {
$(document).mousemove(function (e) {
$('#XY').html("X Axis : " + e.pageX + " | Y Axis " + e.pageY);
});
});


44. 如何把整个的列表元素(List Element,LI)变成可点击的

复制代码 代码如下:


$("ul li").click(function () {
window.location = $(this).find("a").attr("href");
return false;
}); <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>


45. 如何使用jQuery来解析XML(基本的例子)

复制代码 代码如下:


function parseXml(xml) {
//找到每个Tutorial并打印出author
$(xml).find("Tutorial").each(function () {
$("#output").append($(this).attr("author") + "");
});
}


46. 如何检查图像是否已经被完全加载进来

复制代码 代码如下:


$('#theImage').attr('src', 'image.jpg').load(function () {
alert('This Image Has Been Loaded');
});


47. 如何使用jQuery来为事件指定命名空间

复制代码 代码如下:

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/wddpss.html