50个比较实用jQuery代码段(3)

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来为事件指定命名空间：

//事件可以这样绑定命名空间 $('input').bind('blur.validation', function(e){ // ... }); //data方法也接受命名空间 $('input').data('validation.isValid', true);

48. 如何检查cookie是否启用

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) { //没有启用cookie }

49. 如何让cookie过期：

var date = new Date(); date.setTime(date.getTime() + (x * 60 * 1000)); $.cookie('example', 'foo', { expires: date });

50. 如何使用一个可点击的链接来替换页面中任何的URL

$.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="https://www.jb51.net/article/$1">$1</a>‘) ); }); return $(this); } //用法　 $('p').replaceUrl();

就整理这么多吧。

如果大家看的还不过瘾，建议大家看下  超实用的jquery代码段一书。脚本之家正好有pdf版本。大家可以看下。

您可能感兴趣的文章: