jquery，Js笔记

1.操纵界面 find 选择器，获取form表单中值

 var age = theForm.find('select[name=age] option:selected'),

            sex = theForm.find('select[name=sex] option:selected'),

            addr = theForm.find('input[name=addr]'),

            name = theForm.find('input[name=name]');

 2.jQuery ajax中数据以键值对（Key/Value）的形式发送到服务器

使用ajax提交表单数据时可以使用jQuery ajax的serialize() 方法表单序列化为键值对（key1=value1&key2=value2…）后提交。serialize() 方法使用标准的 URL-encoded 编码表示文本字符串。下面是使用serialize()序列化表单的实例：  url－encoded，不是json数据类型？

jQuery ajax原型：

1

$.ajax({

2

   type: "POST",

3

   url: ajaxCallUrl,

4

   data: "Key=Value&Key2=Value2",

5

   success: function(msg){alert(msg);}

6

 });

ajax serialize():

1

$.ajax({

2

         type: "POST",

3

         url:ajaxCallUrl,

4

         data:$('#formID').serialize(),// 要提交的表单

5

         success: function(msg) {alert(msg);}

6

     });

serialize()序列化表单实例：

 

print

?

01

<script type="text/javascript" src="/demo/jquview source

ery/jquery-1.7.2.min.js"

02

></script>

03

<script type="text/javascript">

04

$(document).ready(function(){

05

   $("#button").click(function(){

06

     alert($("#myForm").serialize());

07

   });

08

});

09

</script>

10

<form id="myForm">

11

    姓名 <input value="liming" name="Name" /><br />

12

    职位 <input value="CEO" name="position" /><br />

13

        <input id="button" value="序列化表单" type="button" />

14

</form>

 3.jquery中closest（）和prev（）方法

closest() 方法获得匹配选择器的第一个祖先元素，从当前元素开始沿 DOM 树向上

.closest()

.parents()

从当前元素开始

从父元素开始

沿 DOM 树向上遍历，直到找到已应用选择器的一个匹配为止。

沿 DOM 树向上遍历，直到文档的根元素为止，将每个祖先元素添加到一个临时的集合；如果应用了选择器，则会基于该选择器对这个集合进行筛选。

返回包含零个或一个元素的 jQuery 对象

返回包含零个、一个或多个元素的 jQuery 对象

检索每个段落，找到类名为 "selected" 的前一个同胞元素：

$("p").prev(".selected")

4.jQuery中this与$(this)的区别

1.  alert("this取值："+this.value+"--"+this);//this是js中返回html对象，所以要这样用。  
2. alert("$(this)取值："+$(this).val()+"--"+$(this));//$(this)返回封装后的jquery对象，所以要用jquery的方法。  

1. $("#textbox").hover(   
2.       function() {   
3.            this.title = "Test";   
4.       },   
5.       fucntion() {   
6.           this.title = "OK”;   
7.       }   
8. ); 

这里的this其实是一个Html 元素(textbox)，textbox有text属性，所以这样写是完全没有什么问题的。
但是如果将this换成$(this)就不是那回事了，Error--报了。this与$(this)的区别在此。

1. Error Code：   
2. $("#textbox").hover(   
3.        function() {   
4.           $(this).title ＝ "Test";   
5.        },   
6.        function() {   
7.           $(this).title = "OK";   
8.        }   
9. ); 

这里的$(this)是一个JQuery对象，而jQuery对象沒有title 属性，因此这样写是错误的。

JQuery拥有attr()方法可以get/set DOM对象的属性，所以正确的写法应该是这样：

正确的代码：

1. $("#textbox").hover(   
2.       function() {   
3.          $(this).attr(’title’, ‘Test’);   
4.       },   
5.       function() {   
6.          $(this).attr(’title’, ‘OK’);   
7.       }   
8. ); 

使用jQuery的好处是它包裝了各种浏览器版本对DOM对象的操作，因此统一使用$(this)而不再用this应该是比较不错的选择。