走过平凡人生、留下平凡足迹 注册 | 登陆
浏览模式: 标准 | 列表分类:JQUERY

JQuery中使用AJAX

通用方式:
$.ajax(prop) 通过一个ajax请求,回去远程数据,prop是一个hash表,它可以传递的key/value有以下几种
(String)type:数据传递方式(get或post)。
((String)url:数据请求页面的url
((String)data:传递数据的参数字符串,只适合post方式
((String)dataType:期待数据返回的数据格式(例如 "xml", "html", "script",或 "json")
((Boolean)ifModified: 当最后一次请求的相应有变化是才成功返回,默认值是false
((Number)timeout:设置时间延迟请求的时间。可以参考$.ajaxTimeout
((Boolean)global:是否为当前请求触发ajax全局事件,默认为true
((Function)error:当请求失败时触发的函数。
((Function)success:当请求成功时触发函数
((Function)complete:当请求完成后出发函数

jQuery代码及说明:

» 阅读全文

Tags: jquery, ajax

基于JQuery框架的AJAX

在JQuery中,AJAX有三种实现方式:$.ajax(),$.post,$.get()。

XHTML(主要):

XML/HTML代码
  1. <div id="result" style="background:orange;border:1px solid red;width:300px;height:400px;"></div>  
  2. <form id="formtest" action="" method="post">  
  3. <p><span>输入姓名:</span><input type="text" name="username" id="input1" /></p>  
  4. <p><span>输入年龄:</span><input type="text" name="age" id="input2" /></p>  
  5. <p><span>输入性别:</span><input type="text" name="sex" id="input3" /></p>  
  6. <p><span>输入工作:</span><input type="text" name="job" id="input4" /></p>  
  7. </form>  
  8. <button id="send_ajax">提交</button>  
  9. <button id="test_post">POST提交</button>  
  10. <button id="test_get">GET提交</button>  
  11.   

» 阅读全文

Tags: jquery, ajax, php

利用jQuery写的 - 单钩子 - 可扩展 - 3分离 - 选项卡tabs效果

一个Jquery应用实例

» 阅读全文

Tags: jquery, ajax, javascript

jQuery使用技巧 四

JQuery 使用技巧 一

JQuery 使用技巧 二

JQuery 使用技巧 三

JQuery 使用技巧 四

 

10、几个实用特效功能

其中toggle()和slidetoggle()方法提供了状态切换功能。
如toggle()方法包括了hide()和show()方法。
slideToggle()方法包括了slideDown()和slideUp方法。

11、几个有用的jQuery方法

$.browser.浏览器类型:检测浏览器类型。有效参数:safari, opera, msie, mozilla。如检测是否ie:$.browser.isie,是ie浏览器则返回true。
$.each(obj, fn):通用的迭代函数。可用于近似地迭代对象和数组(代替循环)。

» 阅读全文

Tags: ajax, javascript, php, jquery

jQuery使用技巧 三

JQuery 使用技巧 一

JQuery 使用技巧 二

JQuery 使用技巧 三

JQuery 使用技巧 四

 

 

5、集合处理功能

对于jquery返回的集合内容无需我们自己循环遍历并对每个对象分别做处理,jquery已经为我们提供的很方便的方法进行集合的处理。
包括两种形式:

 

6、扩展我们需要的功能

$.extend({
       min: function(a, b){return a < b?a:b; },
       max: function(a, b){return a > b?a:b; }
});       //为jquery扩展了min,max两个方法

使用扩展的方法(通过“$.方法名”调用):

alert("a=10,b=20,max="+$.max(10,20)+",min="+$.min(10,20));

» 阅读全文

Tags: ajax, javascript, php, jquery

jQuery使用技巧 二

JQuery 使用技巧 一

JQuery 使用技巧 二

JQuery 使用技巧 三

JQuery 使用技巧 四

 

 

四、语法总结和注意事项

 

1、关于页面元素的引用

通过jquery的$()引用元素包括通过id、class、元素名以及元素的层级关系及dom或者xpath条件等方法,且返回的对象为jquery对象(集合对象),不能直接调用dom定义的方法。

» 阅读全文

Tags: ajax, javascript, php, jquery

jQuery使用技巧 一

JQuery 使用技巧 一

JQuery 使用技巧 二

JQuery 使用技巧 三

JQuery 使用技巧 四

随着WEB2.0及ajax思想在互联网上的快速发展传播,陆续出现了一些优秀的Js框架,其中比较著名的有Prototype、YUI、jQuery、mootools、Bindows以及国内的JSVM框架等,通过将这些JS框架应用到我们的项目中能够使程序员从设计和书写繁杂的JS应用中解脱出来,将关注点转向功能需求而非实现细节上,从而提高项目的开发速度。

jQuery是继prototype之后的又一个优秀的Javascript框架。它是由 John Resig 于 2006 年初创建的,它有助于简化 JavaScript™ 以及Ajax 编程。有人使用这样的一比喻来比较prototype和jQuery:prototype就像Java,而jQuery就像ruby. 它是一个简洁快速灵活的JavaScript框架,它能让你在你的网页上简单的操作文档、处理事件、实现特效并为Web页面添加Ajax交互。

» 阅读全文

Tags: ajax, javascript, php, jquery

JQuery 中 is(':visible') 解析及用法

Boolean布尔值is( String  expr )用一个表达式来检查当前选择的元素集合,如果其中至少有一个元素符合这个给定的表达式就返回true。

 

JavaScript代码
  1. $(document).ready(function() {   
  2.         $('#faq').find('dd').hide().end().find('dt').click(function() {//end()为结束前面处理函数,返回到最初的元素   
  3.         //解释:用end()结束find(dd)的hide(),并将find(dt)作用到最初的#fap上   
  4.          var answer = $(this).next();//next()为此元素的下一个元素,可以再加上.next()表示下下一个元素,以此类推   
  5.          if (answer.is(':visible')) {//如果ANSWER 为可见,:visible是可见的意思,相关用法还有:hidden(隐藏),:first(第一个),:last(最后一个)   
  6.              answer.slideUp();//隐藏   
  7.          } else {   
  8.              answer.slideDown();//显示   
  9.          }   
  10.      });   
  11. });  

answer.is(':visible')是指可见的answer元素.
如果可见就调用answer.slideUp();使之隐藏.
else则是不可见的元素 调用answer.slideDown();使之显示.
类似的写法还有answer.is(':first')answer.is(':last')之类的,类似于CSS的伪类a:hover

 

 

 

Tags: ajax, javascript, php, jquery

Records:281234