来源:    发布时间: 2013-11-06

//This snippet will show you how to keep a default value
//in a text input field for when a user hasn't entered in
//a value to replace it
swap_val = [];
$(".swap").each(function(i){
swap_val[i] = $(this).val();
$(this).focusin(function(){
if ($(this).val() == swap_val[i]) {
$(this).val("");
}
}).focusout(function(){
if ($.trim($(this).val()) == "") {
$(this).val(swap_val[i]);
}
});
});
<INPUT value="Enter Username here.." type=text>

//Here's how we used to do it in 1.3.2 using setTimeout
setTimeout(function() {
$('.mydiv').hide('blind', {}, 500)
}, 5000);
//And here's how you can do it with 1.4 using the delay() feature (this is a lot like sleep)
$(".mydiv").delay(5000).hide('blind', {}, 500);

var newgbin1Div = $('');
newgbin1Div.attr('id','gbin1.com').appendTo('body');

jQuery.fn.maxLength = function(max){
this.each(function(){
var type = this.tagName.toLowerCase();
var inputType = this.type? this.type.toLowerCase() : null;
if(type == "input" &amp;&amp; inputType == "text" || inputType == "password"){
//Apply the standard maxLength
this.maxLength = max;
}
else if(type == "textarea"){
this.onkeypress = function(e){
var ob = e || event;
var keyCode = ob.keyCode;
var hasSelection = document.selection? document.selection.createRange().text.length &gt; 0 : this.selectionStart != this.selectionEnd;
return !(this.value.length &gt;= max &amp;&amp; (keyCode &gt; 50 || keyCode == 32 || keyCode == 0 || keyCode == 13) &amp;&amp; !ob.ctrlKey &amp;&amp; !ob.altKey &amp;&amp; !hasSelection);
};
this.onkeyup = function(){
if(this.value.length &gt; max){
this.value = this.value.substring(0,max);
}
};
}
});
};
//Usage:
$('#gbin1textarea').maxLength(500);

//Separate tests into modules.
module("Module B");
test("some other gbin1.com test", function() {
//Specify how many assertions are expected to run within a test.
expect(2);
//A comparison assertion, equivalent to JUnit's assertEquals.
equals( true, false, "failing test" );
equals( true, true, "passing test" );
});

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

if($(element).is(':visible') == 'true') { //The element is Visible }

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;
}
//Use the above function as: $('#gbin1div').center();

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

(function($) {
$.fn.stripHtml = function() {
var regexp = /&lt;("[^"]*"|'[^']*'|[^'"&gt;])*&gt;/gi;
this.each(function() {
$(this).html(
$(this).html().replace(regexp,"")
);
});
return $(this);
}
})(jQuery);
//usage:
$('p').stripHtml();
36. 使用closest来得到父元素

$('#searchBox')

[2]Jquery学习笔记1

W3CSchool全套Web开发手册.chm百度云盘下载http://pan.baidu.com/share/link?shareid=392276&uk=3627406265

黑马Jquery的学习已经结束半个月多了，赵晓虎老师讲得很不错，通过练习能基本掌握Jquery。但久了不用，也遗忘了很多，今天做一下笔记总结，过几天再整理一下做过的习题，包括自动完成，仿QQ微博，评分控件等

1、$(document).ready()方法和window.onload方法区别

为了正常操作页面元素，我们需要把操作元素的JS代码写在$(document).ready()（Jquery）或window.onload（普通JS）中。$(document).ready()(这种写法实际上是/把dom对象document转换成了jQuery对象，然后注册ready()事件)一般我们可以简化为

$(function(){

........jquery代码...........

});

下面介绍一些它们的区别：

执行时机
window.onload方法是在网页中的所有的元素（包括元素的所有关联文件）都完全加载到浏览器之后才执行。而通过jQuery中的$(document).ready()方法只要在DOM完全就绪时，就可以调用了，比如一张图片只要<img>标签完成，不用等这个图片加载完成，就可以设置图片的宽高的属性或样式等。

$(document).ready()方法可以多次使用而注册不同的事件处理程序，而window.onload一次只能保存对一个函数的引用，多次绑定函数只会覆盖前面的函数。

2、$.map函数（obj, fn）和$.each（obj, fn）函数。

• obj (Object): 要重复迭代的对象或数组
• fn (Function): 要在每个对象中执行的函数

$.each（obj, fn(key,value)）用于遍历键值对集合，如果是普通数组，则键为下标index

 

$.map函数（obj, fn(value,index)）

3、Dom和Jquery对象转换

dom对象转为jquery对象，var div=document.getElementById();var jqdom=$(div),这样就可以用jquery的一些成员，如text

jquery对象转为dom对象:var domobj=jqdom[0];这样又可以用dom的一些成员了，如innnerText

4、选择器：

标签选择器：$('p')；

ID选择器：$('#p1');

类选择器:$('.a')

组合选择器：$('#btn,#p1,span')

标签+类选择器：$('p.a')；

层次选择器:$('div p');

 

$('div >p')div下直接子元素；

$('div ~ p')在div后，搜索所有p兄弟，等于$('div').nextAll('p')；

$('div +p')div后只找紧挨着的第一个p元素兄弟，等于$('div').next('p')；

5、隐式迭代：$('p').text('');无需循环便可设置所有p标签文字

6、链式编程：

用链式编程时，需要注意next(),nextAll返回的已经不是原来的元素，也可以用end（）恢复前一次的状态。如$(this).prevAll().css('').end().siblings();

text()、html()、val()这些方法用来设置值的时候可以链式编程，但是获取内容的时候不能链式编程，因为获取值的时候，返回值内容变了。【并不是任何时候都能链式编程，当返回值不是原来的对象时，就不能链式编程了。】

7、设置与获取

设置css：$(this).css({'width':'100px','border':'1px'});获取css中某个属性var width=$(this).css('width')

设置attr：$(this).attr('width','100px')，获取attr某个属性：var width=$(this).attr('width')

设置text：$(this).text('text1'),获取text,var txt=$(this).text()

设置val:$(this).val('text1'),获取text,var val=$(this).val()

8、过滤器:

$('p:first')第一个p元素，等于$('p').first()

$('p':last)最后一个p元素，等于$('p').last();

$('p:eq(2)')根据索引

$('p:even')选取所有偶数个p

$('odd)选取所有奇数个p

$('p:gt(index)')大于索引

$('p:lt(index)')小于索引

$('header')选取所有h1-h6元素

$('input:not(.myclass)')选取样式名不是myclass

过滤器练习：