jQuery

jQuery

• jquery
  1. 选择：

     元素$("div")，标识：$("#id")，样式：$(".css")

     属性：$("input[attr=value]")，拥有[attr]，不等!=，包含*=，开头^=，结尾$=，并列[id][name*="man"]

     表单属性：$("select option:selected")，$("input:enabled")、disabled、checked

     表单：$(":text")、button、file、checkbox、hidden、image、password、radio、submit、reset

     合并：$("div","p")，层级：$("form input")，两级：$("form > :text")，之后+，同辈~

  2. 函数：

     加载完执行：$(function(){});等价于$(document).ready(function(){});

     动态更新元素：$("#id").load(url,[data],[callback]);无参时Get需两次encodeURI中文

  3. 事件：

     确认触发：$(":text").keydown(function(event){if(event.keyCode==13){$(":button").trigger("click");}});

     绑定点击：$(":button").bind("click",function(){alert("you clicked!");});

• jquery.autocomplete：给输入框加入自动提示功能
  1. 简单用法

     var options, a;

     jQuery(function(){

     options = { serviceUrl:'service/autocomplete.ashx' };

     a = $('#query').autocomplete(options);

     });

  2. 其他参数

     var a = $('#query').autocomplete({

     serviceUrl:'service/autocomplete.ashx',

     minChars:2,

     delimiter: /(,|;)\s*/, // regex or character

     maxHeight:400,

     width:300,

     zIndex: 9999,

     deferRequestBy: 0, //miliseconds

     params: { country:'Yes' }, //aditional parameters

     noCache: false, //default is false, set to true to disable caching

     // callback function:

     onSelect: function(value, data){ alert('You selected: ' + value + ', ' + data); },

     // local autosugest options:

     lookup: ['January', 'February', 'March', 'April', 'May'] //local lookup values

     });

  3. Ajax返回json格式：query查询，suggestions提示，data回调（可选，比如返回关键词命中次数hits）

     {

     query:'Li',

     suggestions:['Liberia','Libyan Arab Jamahiriya','Liechtenstein','Lithuania'],

     data:['LR','LY','LI','LT']

     }

  4. 提示层的内容及样式：左边显示提示，右边显示分数。

     fnFormatResult:function fnFormatResult(value, data, currentValue){

     var reEscape = new RegExp('(\\' + ['/', '.', '*', '+', '?', '|', '(', ')', '[', ']', '{', '}', '\\'].join('|\\') + ')', 'g');

     var pattern = '(' + currentValue.replace(reEscape, '\\$1') + ')';

     return '<span >' + value.replace(new RegExp(pattern, 'gi'), '<strong >$1<\/strong>')+'</span>' + '<span >' + data + '</span>';

     }

  5. 自动提交搜索

     autoSubmit:true,

     onSelect: function(value, data) {

     //document.forms["showSearch"].submit();

     },

• jquery.uploadify：上传文件，有进度显示，支持多文件多线程上传

  1. 执行脚本：可自动上传auto:true或点击上传按钮

     $(function() {

     $('#fileInput').uploadify({

     'uploader' : '<%=artPath%>/flash/uploadify.swf',

     'script' : '<%=basePath%>/file/ajaxFileUpload.ac',//上传完成后请求路径

     'cancelImg' : '<%=artPath%>/images/cancel.png',

     'fileDataName' : 'file', //struts Action有File file和String fileFileName、fileContentType保存已上传的文件、文件名、文件类型

     'sizeLimit' : 19871202000, //设置单个文件大小限制

     'queueID':'fileQueue',

     'removeCompleted' : false,

     'onComplete': function(event,queueID,fileObj,response,data{

     if(!response || response == "P00000000"){

     alert("文件：" + fileObj.name + "上传不成功，请删除后再添加！");

     }else if(!$("#pid").attr("value")){

     $("#pid").attr("value", response);

     }else{

     $("#pid").attr("value", $("#pid").attr("value") + "," + response);

     }

     },

     'auto':false,//自动上传会在选定文件后立即出发，否则通过函数uploadifyUpload();

     'multi':true,//多文件上传会多次请求script指定的路径

     });

     });

  2. 页面元素：文件选择框，上传按钮，保存上传记录id值便于提交后使用

     <input />

• jQuery.zTree：

通过 为知笔记 发布