分类 "jQuery" 的存档.

为jstree添加双击事件切换[展开/收缩]功能

一、概述

jstree是一个基于jQuery开发的优秀树插件,能够快速生成美观实用的树;目前项目中使用了这个插件遇到了一点问题,以前使用simpletree的时候可以双击父节点[展开/收缩]子节点,但是好像jstree没有提供这个功能,所以只有自己开发了。

使用的版本号:jsTree 1.0-rc1
没有添加双击功能时:http://www.wsria.cn/demo/jstree/jstreeNormal.html

二、分析源码

阅读更多…

Popularity: 20%

jqGrid查询中文乱码问题解决办法

jqGrid是我用过最好的基于jQuery的列表插件,在项目中试用后效果很不错,基于jQuery UI的界面美观并且可以更好皮肤……

花了一天时间实现了增删改和查询功能,但是在查询中文的时候遇到了乱码问题……诡异,说一下情况:

  • 我的开发环境是全站UTF-8,而且有编码Filter;
  • jqGrid版本为:3.6.4

在后台断点调试发现如下特点:

1、新增、编辑没有乱码问题

2、查询中文后台时得到的参数是乱码

然后就考虑了,如果是开发环境问题那肯定全部都有乱码问题,所以问题应该在jqGrid的查询函数里面,最后通过Firebug找到了:

c.find(".ui-search").click(function() {

这一行是查询功能的开始也就是点击“查询”的触发函数

所以根据以往的经验在这里把参数值编码一次就可以了,也就是encodeURIComponent函数具体修改如下:

  1. 找到第6202行
  2. 找到代码
    6201
    6202
    6203
    
    var p = jQuery(this).find("select[name='field'] :selected").val(),
    g = jQuery(this).find("select[name='op'] :selected").val(),
    f = jQuery(this).find("input.vdata,select.vdata :selected").val();
    
  3. 现在看到这里的3行代码就是查询时获取参数的3个变量,我们要修改的就是这里,最终代码:
    6202
    6203
    6204
    
    var p = encodeURIComponent(jQuery(this).find("select[name='field'] :selected").val()),
    g = encodeURIComponent(jQuery(this).find("select[name='op'] :selected").val()),
    f = encodeURIComponent(jQuery(this).find("input.vdata,select.vdata :selected").val());
    

到此大功告成

——————————–分割线———————————–

为了方便网友顺便提供本人修改后的jqGrid3.6.4版本的源码,分为3中类型(未压缩、迷你版、压缩版pack)

下载:jquery.jqGrid.3.6.4.js 共 119 次

下载:jquery.jqGrid.min.3.6.4.js 共 100 次

下载:jquery.jqGrid.pack.3.6.4.js 共 76 次

Popularity: 25%

[转][推荐]jqGrid基础学习系列文章

最近项目中使用了jqGrid数据网格插件,看到了网友写的一系列文章分享给大家看

Popularity: 28%

jQuery 1.4.1 中文文档 CHM 版发布

小飞翻译并制作的中文CHM jQuery 1.4.1文档

CHM文档地址:http://code.google.com/p/jquery-api-zh-cn/downloads/list

小飞博客:http://shawphy.com/2010/02/jquery-1-4-1-api-zh-cn-chm-released.html

Popularity: 8%

翻译:jQuery1.4新特性官方文档

从CSDN上找到了中文的jQuery1.4更新说明,发上来分享一下

下载:jQuery1.4官方文档.doc 共 214 次

Popularity: 4%

jQuery1.4 API 区别与更新中文版

前几天发不过jQuery1.4 正式版的简单更新说明,后来在网上找到 金山(一个网友) 博客翻译了,现在这社会就得做自己所长的,所以借用过来供大家看看:http://js.007studio.net/?p=276

Popularity: 4%

jQuery 1.4 正式版发布啦(14 Days of jQuery)

jquery 1.4

jquery 1.4

发布了两个alpha版本,4小时前终于发布了1.4正式版,先放链接:

大致看了一下官网的更新文档:

jQuery1.4对代码库进行了内部重写组织,开始建立一些风格规范。老的core.js文件被分为attribute.js, css.js, data.js, manipulation.js, traversing.js和queue.js。CSS和attribute的逻辑分离。并修正了207个老版本的错误。

1、Easy Setter Functions(可以自定义一个function设置属性值)

.css(), .attr(), .val(), .html(), .text(), .append(), .prepend(), .before(), .after(), .replaceWith(), .wrap(), .wrapInner(), .offset(), .addClass(), .removeClass(), and .toggleClass().这些setter方法可以传入一个function根据业务自定义需要设置的值

// find all ampersands in A's and wrap with a span
$('a').html(function(i,html){
  return html.replace(/&amp;/gi,'<span class="amp">&amp;</span>');
});
// Add some information to the title of the anchors
$('a[target]').attr("title", function(i,title){
  return title + " (Opens in External Window)";
});

重写了这些常用方法,大幅度提升性能
另外,attribute(改进了.attr()的性能)、jQuery()核心函数、CSS(.css()性能有两倍提升)、特效和事件、DOM操作等也有显著改进。

阅读更多…

Popularity: 3%

庆祝开源个人账务管理系统Google PR上升到5

个人账务管理系统PR=5

个人账务管理系统PR=5

Popularity: 4%

推荐:基于jQuery开发仿Google Calendar(jQuery Week Calendar)

jQuery Week Calendar

jQuery Week Calendar

在open-open上发现的,试了一下很不错,对于日常开发中对计划安排或者对操作性要求较高的可以使用这个插件

目前开发的一个系统正好需要这样的功能所以推荐给大家

官网:http://www.redredred.com.au/projects/jquery-week-calendar/

Live Demo

The following live demonstration? has a basic calendar with a few events in it. It demonstrates most of the major functionality by triggering events that are displayed as messages in the top right hand corner of the screen.? More demos will? come soon…

Demo 1 (Basic)

  • Demo 1 shows basic calendar functionality. Calendar Events are supplied as a local javascript array. All triggered events are displayed as messages, calendar events in the past are shaded gray using the eventRender callback.

Demo 2 (Multi data-source and dynamic config options)

  • Demo 2 allows you to select from two different data sources. These are both local javascript objects but could just as easily have come from a remote server. The data returned includes an ‘options’ property which overrides the default calendar options for ‘timeslotHeight’ and ‘timeslotsPerHour’.

Demo 3 (Create / update / delete using jquery UI)

  • This demo shows the use of jquery ui modal dialog for creating, updating and deleting events. It also demonstrates the use of
    • Staggered overlapping events
    • Querying the calendar for valid timeslots for a date to populate calendar event form select fields
    • Limited display of timeslots based on business hours

Popularity: 19%