JQuery学习笔记

发现以前学了Jquery,都忘关了，去上班时，发现许多人都不怎么懂，于是又开始学习，从头开始，以往经验之得，做好笔记事半功倍。我就在这里做笔记吧！

1.jQuery核心函数

    $()将在当前的 HTML document中查找 DOM 元素；

示例

找到所有 p 元素，并且这些元素都必须是 div 元素的子元素。

HTML 代码:

<p>one</p> <div><p>two</p></div> <p>three</p>

jQuery 代码:

$("div > p");

结果:

[ <p>two</p> ]


动态创建一个 div 元素（以及其中的所有内容），并将它追加到 body 元素中。

$("<div><p>Hello</p></div>").appendTo("body");

jQuery(callback)

$(document).ready()的简写。允许你绑定一个在DOM文档载入完成后执行的函数。

当DOM加载完成后，执行其中的函数。

jQuery 代码:

$(function(){
// 文档就绪
});

使用 $(document).ready() 的简写，同时内部的 jQuery 代码依然使用 $ 作为别名，而不管全局的 $ 为何。

jQuery 代码:

jQuery(function($) {
// 你可以在这里继续使用$作为别名...
});

each(callback)

迭代两个图像，并设置它们的 src 属性。注意:此处 this 指代的是 DOM 对象而非 jQuery 对象。

HTML 代码:

<img/><img/>

jQuery 代码:

$("img").each(function(i){
   this.src = "test" + i + ".jpg";
 });

结果:

[ <img src="test0.jpg" />, <img src="test1.jpg" /> ]

 

2.用ajax提交表单数据

<script>中代码：

  $.ajax({
                   type: "POST",
                   url: "../calendar/task.do",
                   data:"start="+startField.val()+"&end="+endField.val()+"&title="+titleField.val()+"&body="+bodyField.val(),
                 /*  data: 'start='+startField.val()+'&end='+endField.val()+'&title='+titleField.val()+'&body='+bodyField.val(),*/
                   success:  function(data){alert(data);}
                   });
 

后台代码：

@Controller
@RequestMapping("/calendar")
public class CalendarController extends ControllerFather {
 @Inject
 private TaskService service;

 @RequestMapping(value = "/task", method = RequestMethod.POST)
 public ModelAndView add( Task task ,PageModel pageModel,
   HttpServletRequest request, HttpServletResponse response) {
  // System.out.println(request.getParameter("start"));
  
   String start = request.getParameter("start");
   
   System.out.println(start);

   String end = request.getParameter("end");
   
   System.out.print("start:" + end);

   String title = request.getParameter("title");
   String body = request.getParameter("body");
   task.setBody(body);
   task.setStart(start);
   task.setEnd(end);
   task.setTitle(title);
   // 添加
    service.saveTask(task);

 
  
  System.out.print("title:" + title);
 
  pageModel = service.getListPage(pageModel, Task.class);

  writeJSONArray(pageModel.getDatas(), response);
  // System.out.print(pageModel.getDatas());
  return null;

 }

3.学习jquery1.2api网址：http://www.pmal.net/jquery/