jQuery技术

js、jquery实用小技巧集合

字号+ 作者:H5之家 来源:H5之家 2015-09-07 11:08 我要评论( )

Tip16:JS的定时器 JS 中有两种定时器,setTimeout('fn', t) 和 setInterval('fn', t),'fn'指的是定时执行的方法名,字符串类型。 setTimeout('fn', t): 只执行一次,执行完成后将销毁。 setInterval('fn', t):一直执行。 (Date:2012-02-17) -----------

Tip16:JS的定时器

  JS 中有两种定时器,setTimeout('fn', t) 和 setInterval('fn', t),'fn'指的是定时执行的方法名,字符串类型。

 

  setTimeout('fn', t):

只执行一次,执行完成后将销毁。

  setInterval('fn', t):一直执行。

 

(Date:2012-02-17)

 

-----------------------------------------------------------------

Tip15:Jquery触发回车事件

$(function () {
$('#target').bind('keyup', function (event) {
if (event.keyCode == 13) {
alert("Hello~");
}
});
});

(Date:2011-10-28)

-----------------------------------------------------------------

 Tip14:获得select 的值

  jquery可以像获取textbox值一样获取select的值:$('select').val();

(Date:2011-10-19)

-----------------------------------------------------------------

Tip13:复制文本

  使用  window.clipboardData.setData('text', text); 可以将text文本放到系统剪贴板中,实现文本的复制功能。但是,这个方法只被IE所支持。Google Chrome 和Foxfire都不支持。所以,在使用时应先判断浏览器是否支持:if (window.clipboardData) { 

window.clipboardData.setData('text', text); }

(Date:2011-9-16)

-----------------------------------------------------------------

Tip12:选择文本

  对于input或者textarea的文本选择,jquery提供了一个简单的函数完成:select(),在调用它的时候,需要确保文本框可见,并且已经获得焦点。

 

  $("#txtSample").focus().select();  //现货的焦点,然后选择文本

(Date:2011-9-16)

-----------------------------------------------------------------

Tip11:鼠标事件

  mouseover 和 mouseout、

mouseenter 和  mouseleave;这两组事件都是鼠标移入和移出元素时触发的,他们的最大区别是:

mouseover 和 mouseout是冒泡的,如果鼠标移动到它们的子元素,同样会触发该事件,而

mouseenter 和  mouseleave是不会冒泡的。

 

  这个区别很重要!

(Date:2011-9-14)

-----------------------------------------------------------------

Tip10:页面跳转

使用js直接对window.location.href 赋一个URL字符串值即可实现跳转。

window.location.href = 'a.html';

(Date:2011-6-18)

-----------------------------------------------------------------

Tip9:jQuery对象的扩展

$.extend(target,prop1,propN):用一个或多个其他对象来扩展一个对象,返回这个被扩展的对象。这是jquery实现的继承方式。例如:
  $.extend(settings, options);
合并settings和options,并将合并结果返回settings中,相当于options继承setting并将继承结果保存在 setting中。
  var settings = $.extend({}, defaults, options);
合并defaults和options,并将合并结果返回到setting中而不覆盖default内容。可以有多个参数(合并多项并返回)

(Date:2011-6-18)

-----------------------------------------------------------------

Tip8:jQuery删除数组中的项

如Tip7中所说,使用$.grep()方法删除数组中的元素。

上面的代码将删除数组array中的元素'b'。

(Date:2011-6-18)

-----------------------------------------------------------------

Tip7:jQuery数组的处理

$.each(obj, fn);

  对obj进行遍历,obj为要遍历的数组或对象;fn为处理函数,可选的参数为索引和内容,例如var fn = function(index, content){};如果需要结束遍历,请返回false,其它的返回值将会被忽略。

  该方法可以用来处理JSON数据对象。

$.inArray(obj, array);

  判断数组array中是否包含obj对象,如果存在,返回对应的下标,如果不存在,返回-1;

$.map(array, fn);

  将一个数组中的元素转换到另一个数组中。array为需要转换的数组,fn为处理函数;这个方法的返回值是一个经过处理后的新数组。

$.merge(array1, array2);

  合并两个数组;将数组array2中的内容复制到array1中,并将结果返回。merge方法不会去除重复,需要使用 $.unique()去除重复。

$.unique(array);

  去除数组array中的重复项。

$.grep(array, fn, [invert]);

  过滤数组中的元素;该方法对数组array中的每一个对象都调用fn方法;

  invert 可选参数;如果 "invert" 为 false 或未设置,则函数返回数组中由过滤函数返回 true 的元素,当"invert" 为 true,则返回过滤函数中返回 false 的元素集。

  该方法常用来删除数组中的元素

(Date:2011-6-18)

-----------------------------------------------------------------

Tip6:去除string开头和结尾的空格

js中没有提供trim函数供我们去掉字符串两段的空字符,jQuery中扩展了这一功能:

$.trim(str):删除字符串两端的空白字符。
如:$.trim(" hello, how are you? "); //返回"hello,how are you? "

(Date:2011-6-18)

-----------------------------------------------------------------

Tip5:添加事件和移除事件

为一个jQuery对象添加事件是很方便的事情:

$('#btn').click(fn);

$('#btn').bind('click', fn);

jQuery提供了为一个对象的事件提供多个处理函数的机制,我们添加了一个click事件处理方法后,还可以继续添加,而不会覆盖先前的处理方法。

当调用unbind方法时移除绑定的事件订阅:

$('#btn').unbind();    //将会移除所有的事件订阅

$('#btn').unbind('click')  //将会移除click事件的订阅

(Date:2011-6-18)

-----------------------------------------------------------------

Tip4:扩展需要的功能

jQuery提供了extend方法让我们来扩展自己需要的功能。例如:

$.extend({
  sum: function(num1, num2){return num1+num2; },
}); //为jquery扩展了sum方法


使用扩展的方法(通过“$.方法名”调用):
alert($.sum(10, 20));

(Date:2011-6-18)

-----------------------------------------------------------------

Tip3:获取jQuery对象集合中的一项

 

1.本站遵循行业规范,任何转载的稿件都会明确标注作者和来源;2.本站的原创文章,请转载时务必注明文章作者和来源,不尊重原创的行为我们将追究责任;3.作者投稿可能会经我们编辑修改或补充。

相关文章
  • 7个有用的jQuery小技巧

    7个有用的jQuery小技巧

    2016-02-26 13:02

  • jQuery制作select双向选择列表

    jQuery制作select双向选择列表

    2016-02-26 11:00

  • 全面详细的jQuery常见开发技巧手册

    全面详细的jQuery常见开发技巧手册

    2016-02-26 10:02

  • 强大的jQuery移动插件Top 10

    强大的jQuery移动插件Top 10

    2016-02-25 09:05

网友点评
<