API

现在来看下其API

appendTo ：将弹出框添加到的父容器，参数为css选择器

opacity ：透明度

overlayId ：遮罩层id

overlayCss ：{Object}定义遮罩层样式

containerId ：弹出窗体容器id

containerCss ：定义容器的样式

dataId ：内容层id

containerCss ：内容层的样式

minHeight ：最小高度

minWidth ：最小宽度

maxHeight ：最大高度

maxWidth ：最大宽度

autoResize：是否自适应大小

zIndex ：弹出层的z-index

close ：是否允许关闭

closeHTML ：自定义关闭按钮

closeClass ：关闭层样式

overlayClose ：点击遮罩层是否关闭弹出窗体

position ：数组 [top, left] 自定义弹出窗体位置

onOpen ：弹出窗体打开时候的回调函数

onShow ：弹出窗体显示时候的回调函数

onClose ：弹出窗体关闭时候的回调函数

最后 $.modal.close(); 关闭弹出窗体

2、无边框。推荐的写法是 border:none;，哈哈，我一直在用这个。 border:0; 只是定义边框宽度为零，但边框样式、颜色还是会被浏览器解析，占用资源。

3、不要使用过小的图片做背景平铺。这就是为何很多人都不用 1px 的原因，这才知晓。宽高 1px 的图片平铺出一个宽高 200px 的区域，需要 200*200=40, 000 次，占用资源。

4、慎用 * 通配符。所谓通配符，就是将 CSS 中的所有标签均初始化，不管用的不用的，过时的先进的，一视同仁，这样，大大的占用资源。要有选择的初始化标签。

5、样式放头上，脚本放脚下。不内嵌，只外链。

6、坚决不用 CSS 表达式。

7、使用 引用样式表，而不是通过 @import 导入。

8、一般来说，PNG 比 GIF 要小，小得多。再者，GIF 中有多少颜色是被浪费的，很值得优化。

9、千万不要在 HTML 中缩放图片，一者不好看，二者占资源。

10、正文字体最好用偶数，12px、14px、16px，效果非常好。特例，15px。

11、block、ul、ol 等上下留出至少一倍行距，左侧至少两倍行距，右侧随意。

12、段落之间，至少要有一倍行距。

13、强行指定某些元素的 line-height，正文 1.6 倍于文字大小，标题 1.3 倍。

14、中文标点用全角。英文夹杂在中文中，左右空格，半角。

15、中文字体的粗体和斜体，远离较好，利民利己。

2、往版本库中添加新的文件...

XML Syntax:
<?xml version ="1.0" encoding="utf-8"?>
<rows>
<page> </page>
<total> </total>
<records> </records> (new tag)
<row id = “unique_rowid”>
<cell> cellcontent </cell>
<cell> <![CDATA[<font color=”red”>cell</font> content]]> </cell>
…
</row>
…
</rows>

JSON Syntax:

{ total: xxx, page: yyy, records: zzz, rows: [
{id:”1″,cell:[”Row 1:1″,”Row 1:2″,”Row 1:3″,”Row 1:4″]},
{id:”2″,cell:[”Row 2:1″,”Row 2:2″,”Row 2:3″,”Row 2:4″]},
{id:”3″,cell:[”Row 3:1″,”Row 3:2″,”Row 3:3″,”Row 3:4″]},
…

]}

In page tag server must return the number of the requested page.
In total tag server must return the total pages of the query.
In records tag server can return the total records from the query.
In cell tag is the actual data. Note that CDATA can be used. This way we can add images, links and check boxes.

Actually the cell data in the grid is inserted as html and not as text.

In PHP script use the following code for page header (when using xml):

<?php
if ( stristr($_SERVER["HTTP_ACCEPT"],"application/xhtml+xml") ) {
header("Content-type: application/xhtml+xml"); } else {
header("Content-type: text/xml");
}
echo("<?xml version=\"1.0\" encoding=\"utf-8\"?>\n");
?>


2. The selector in the html document must be a table element of class “scroll”. Example:

<table id= "table_id" class="scroll" cellpadding="0" cellspacing="0">
</table>

3. Parameters passed to the server url (you must use a get method to obtain the values) are:
page - the requested page;
rows - the number of the requested rows that server must return;
sidx - the name (or number) of the column in the ORDER BY clause;
sord - way in which the column must be sorted - asc (ascending) or desc (descending);

4. Parameters used when constucting the grid. Example:
…
var mygrid = $(”#table_id”).jqGrid( {
url: “myurl.php”,
height: 150,
page: 1,
colNames: [”colname1″,”colname2″],
colModel: [
{index : ‘col1′, width : 80, sortable : true, align: ‘left’},
{index : ‘col’, width : 80, sortable : true, align: ‘left’}
],
rowNum: 20,
rowList: [20,30,40,50],
pager: $(”#page_selector_id”),
sortorder: “asc”,
sortname: “”,
altRows: true,
sortascimg : “sort_asc.gif”,
sortdescimg : “sort_desc.gif”,
firstimg: “first.gif”,
previmg: “prev.gif”,
nextimg: “next.gif”,
lastimg: “last.gif”,
onSelectRow: function (iRow) { …},
onSortCol: function (idx,iCol){ …},
ondblClickRow: function (iRow) { … }
});
…

Description of the parameters:

url: (mandatory) - the url where the XML file resides or is constructed with SQL.
height: (optional) - the heght of the grid in pixels. Default 150.
page: (optional) - the requested page number. Default 1.
colNames: (mandatory) - array which describes the column names in the grid
colModel: (mandatory) - array which describes the parameters of the columns. The parameters are:

• name: (optional) - the index name which is used when sorting the data. Alias name can be used - i.e mytable.mycol. If this parameter is not set a unique number is assign in the order in which apper in the array - i.e 1,2… .
• width: (mandatory) - the initial width of the column in pixels. Note that the width of the grid is sum of all columns width + 20 pixels for the scrolling.
• sortable: (optional) describes if the column can be sorted. Valid values are true or false. Default is true.
• align: (optional) - This attribute specifies the horizontal alignment of the element. Posible values are: left, center, right. Default is left.
• sorttype: (optional) - This attribute describes the type of the field. This is only used if datatype option is set to “local”, or when load at once method is used. The possible values are: int, float, date, text.

rowNum: (optional) the number of rows that must be returned from the server (query). Default is 20.
rowList: (optional) if set this parameter construct a select box element in the pager in wich the user can change the number of the visible rows. Default is empty array.
pager: (optional) this parameter describes the pager. This must be a valid html element. Example: $(”#mypager_id”). If the element is of class “scroll”, then the width is equal to the grid.
sortorder: (optional) sets the sorting order. Default asc (ascending)
sortname: (optional) sets the initial sorting column. Can be a name or number. Default is empty string.
altRows: (optional) set a zebra like table. Default true
sortascimg : and sortdescimg : (optional) these parameters are liks to image url which are used when the user sort a column.
firstimg: , previmg: , nextimg: , lastimg: (optional) these parameters are liks to image url which are used in the pager.
onSelectRow: (optional) raised immideatly after row was clicked. The input parameter of the function is the row_id. Default null.
onSortCol: (optional) raised immideatly after sortable column was clicked and before sorting the data. The input parameters of the function are the index name and column index. Default null.
ondblClickRow: (optional) raised immideatly after row was double clicked. The input parameter of the function is the row_id. Default null.
datatype: (optional). Default “xml”. Possible values “xml” or “json” or “local”. Set this option according to data type returned from the server. If set to “local” the grid expected to load data local via array.
width: (optional) Default: none. If this option is not set, the width of the grid is a sum of the width’s of the columns defined in the column model + 20 pixels. If this option is set the width of each column is scaled according to the defined width. Example: if we define two columns with a width of 80 and 120 pixels, but want the grid to have a 300 pixels - then the columns are recalculated as follow: 1- column = 300(new width)/200(sum of all width)*80(column width) = 120 and 2 column = 300/200*120 = 180.
rowheight: (optional) Default: null. This option defines the height of the single row ( must make some experiments here). If is set the height of the grid is changed according to the number of the returned rows from the server and the scroll bar does not appear. Important note here - if you want this to work you should not change the property overflow hidden and white-space nowrap in the CSS
viewrecords: (optional) Default: false. If you want to view the total records from the query in the pager bar you should set option to true. The related tag is: records in xml or json definitions.
recordtext: (optional) This displays a text after the viewed records. The default value is in English and is: Record(s).
imgpath: (optional) Default: empty string. Whit this option you can define the path to the images that are used from the grid. Define this without a “/” at the end.
loadtext: (optional) Default: “Loading…”. With this we can change the text which apper when requesting and sorting data.
loadonce: (optional) Default: false. If this flag is set to true, the grid load only once the data from the server. All other manipulations are done at client side. Note that in this case the pager is disabled.
multiselect: (optional) Default: false. If this flag is set to true a multi selection of rows is enabled. A new column at left side is added. This can be used with server and local data.
subGrid: (optional) Default: false. Is set to true this enables using of sub grid.
subGridUrl: (optional) Default: empty string. This option has effect only if subGrid option is set to true. This describes the url for the subgrid data. Additinally to this url is added parameter “id” which is the id of the row. If using PHP we can use $id = $_GET[’id’]; to obtain the needed information of the sub grid data.
subGridModel:(optional) Default: empty array. This option has effect only if subGrid option is set to true. This option describes the model of the subgrid. The syntax is as follow: subGridModel:[{ name : [’n1′,’n2′,..,’nN’],width : [w1,w2,…,wN] }] - where n1..nN are the names which appears at the header of the sub grid and w1..wN are the widths of the columns. See example page for using a sub grid.

5. Methods

After constructing the grid we can use the following methods.

getUrl - return the current url
getSortName - return the current sortname
getSortOrder - return the current sorting order
getSelectedRow - return the current selected row
getPage - return the curent page number
getRowNum - return the current number of requested rows
setUrl(’newurl’) - set a new url
setSortName(’newsortname’) set a new sort name
setSortOrder(’newsortorder’) set a new sort order
setPage(newpage) set a new page number
setRowNum (newrownum) set a new number of requested rows.
.trigger( ‘reloadGrid’) method reloads a data with the current settings.

New Methods

getMultiRow return a one dimensional array with the selected rows id’s. Can be used if the flag multiselect is set to true.
getDataType return the current data type. Possible values are : xml, json, local.
getRecords return the number of records in grid.
setDataType(newdatatype) Set a new data type. Possible values are : xml, json, local.
getRowData(rowid) Return associative array ([name:value,..])with the values of the requested rowid. If the row can not be found the method returns empty array.
delRowData(rowid) Deletes row with the id - rowid. Return true is the operation success, otherwise false.
setRowData(rowid, data) Updates the values (using data array) in the row with the given rowid. The syntax of data array is: {name1:value1,name2: value2…} where the name is the name of the column as described in the colModel and the value is the new value. Return true on success.
addRowData(rowid,data) Insert new row with id rowid at the end of the grid using data array.The syntax of data array is: {name1:value1,name2: value2…} where the name is the name of the column as described in the colModel and the value is the value. Return true on success.
toXmlData(encoding) Return a XML string with a current data in the grid. The default encoding is utf-8.
toJSONData() Return a string in JSON format with the current data in the grid.

If you want to set new parameters a reloadGrid method load a data with a new setting.
Example:
mygrid.setPage(5);
mygrid.trigger(’reloadGrid’);

where mygrid = $(”table_id”).jqGrid(…);

loads a Page 5 from the server

A simple PHP MySQL generation of the XML File can be found here

　　这里的SUM作用在所有返回记录的population字段上，结果就是该查询只返回一个结果，即所有国家的总人口数。

　　通过使用GROUP BY 子句，可以让SUM 和 COUNT 这些函数对属于一组的数据起作用。当你指定 GROUP BY region 时， 属于同一个region（地区）的一组数据将只能返回一行值，也就是说，表中所有除region（地区）外的字段，只能通过 SUM, COUNT等聚合函数运算后返回一个值。

　　HAVING子句可以让我们筛选成组后的各组数据，WHERE子句在聚合前先筛选记录．也就是说作用在GROUP BY 子句和HAVING子句前．
而 HAVING子句在聚合后对组记录进行筛选。

　　让我们还是通过具体的实例来理解GROUP BY 和 HAVING 子句，还采用第三节介绍的bbc表。

　　SQL实例：

　　一、显示每个地区的总人口数和总面积：

　　先以region把返回记录分成多个组，这就是GROUP BY的字面含义。分完组后，然后用聚合函数对每组中的不同字段（一或多条记录）作运算。

　　二、 显示每个地区的总人口数和总面积．仅显示那些面积超过1000000的地区。

　　在这里，我们不能用where来筛选超过1000000的地区，因为表中不存在这样一条记录。

　　相反，HAVING子句可以让我们筛选成组后的各组数据．

同时使用CSS和XPath

看几个例子：

隐藏所有包含有链接的段落：

$("p[a]").hide();

显示页面的第一个段落：

$("p:eq(0)").show();

隐藏所有当前可见的层元素：

$("div:visible").hide();

获取所有无序列表的列表项：

$("ul/li")

 /* valid too: $("ul > li") */

取得name值为bar的输入字段的值：

$("input[@name=bar]").val();

所有处于选中状态的单选r按钮：

$("input[@type=radio][@checked]")

如果你对查询语言的工作原理还有疑问，可以订阅这里的邮件列表。

CSS查询器

jQuery完全支持CSS1.3。

关于CSS的一些资料查看下面的连接：

• CSS 1
• CSS 2
• CSS 3

下面列出来的是支持的CSS查询器的列表式语法：

• * 任何元素
• E 类型为E的元素
• E:root 类型为E，并且是文档的根元素
• E:nth-child(n) 是其父元素的第n个类型为E的子元素
• E:first-child 是其父元素的第1个类型为E的子元素
• E:last-child  是其父元素的最后一个类型为E的子元素
• E:only-child  且是其父元素的唯一一个类型为E的子元素
• E:empty 没有子元素（包括text节点）的类型为E的元素
• E:enabled
• E:disabled 类型为E，允许或被禁止的用户界面元素
• E:checked 类型为E，处于选中状态的用户界面元素（例如单选按钮或复选框）
• E.warning 类型为E，且class属性值为warning
• E#myid 类型为E，ID为 "myid"。（至多匹配一个元素）
• E:not(s) 类型为E，不匹配选择器s
• E F 在类型E后面的类型为F的元素
• E > F 为E元素子元素的F元素
• E + F an F element immediately preceded by an E element
• E ~ F an F element preceded by an E element

不同之处

所有的属性选择器都被写成和XPath极其相似（因为所有的属性都以@符号开始）。

• E[@foo] 拥有foo属性的E元素
• E[@foo=bar] foo属性的值为bar的E元素
• E[@foo^=bar] foo属性的值以字符串"bar"开始的E元素
• E[@foo$=bar] foo属性的值以字符串"bar"结尾的E元素
• E[@foo*=bar] foo属性的值包含有字符串"bar"结尾的E元素 

不支持的部分

• E:link
• E:visited an E element being the source anchor of a hyperlink of which the target is not yet visited (:link) or already visited (:visited)
• E:active
• E:hover
• E:focus an E element during certain user actions
• E:target an E element being the target of the referring URI
• E::first-line the first formatted line of an E element
• E::first-letter the first formatted letter of an E element
• E::selection the portion of an E element that is currently selected/highlighted by the user
• E::before generated content before an E element
• E::after generated content after an E element

jQuery不支持下列的选择器，因为这些没什么用处。

• E:nth-last-child(n) an E element, the n-th child of its parent, counting from the last one
• E:nth-of-type(n) an E element, the n-th sibling of its type
• E:nth-last-of-type(n) ...

jQuery 是继 prototype 之后又一个优秀的 Javascript 框架。其宗旨是—写更少的代码,做更多的事情。它是轻量级的 js 库(压缩后只有21k) ，这是其它的 js 库所不及的，它兼容 CSS3，还兼容各种浏览器（IE 6.0+, FF 1.5+, Safari 2.0+, Opera 9.0+）。 jQuery 是一个快速的，简洁的 javaScript 库，使用户能更方便地处理 HTML documents、events、实现动画效果，并且方便地为网站提供 AJAX 交互。 jQuery 还有一个比较大的优势是，它的文档说明很全，而且各种应用也说得很详细，同时还有许多成熟的插件可供选择。 jQuery 能够使用户的 html 页保持代码和 html 内容分离，也就是说，不用再在 html 里面插入一堆js来调用命令了，只需定义 id 即可。今天在Kollermedia.at上发现了一篇JQuery插件列表的文章，特推荐如下。

文件上传(File upload)

Ajax File Upload.
jQUploader.
Multiple File Upload plugin. 
jQuery File Style.
Styling an input type file.
Progress Bar Plugin.

表单验证(Form Validation)

jQuery Validation.
Auto Help.
Simple jQuery form validation.
jQuery XAV - form validations.
jQuery AlphaNumeric.
Masked Input.
TypeWatch Plugin.
Text limiter for form fields.
Ajax Username Check with jQuery.

表单－选取框(Form - Select Box stuff)

jQuery Combobox.
jQuery controlled dependent (or Cascadign) Select List.
Multiple Selects.
Select box manipulation.
Select Combo Plugin.
jQuery - LinkedSelect
Auto-populate multiple select boxes.
Choose Plugin (Select Replacement).

表单基本、输入框、选择框等(Form Basics, Input Fields, Checkboxes etc.)

jQuery Form Plugin.
jQuery-Form.
jLook Nice Forms.
jNice.
Ping Plugin.
Toggle Form Text.
ToggleVal.
jQuery Field Plugin.
jQuery Form’n Field plugin.
jQuery Checkbox manipulation.
jTagging.
jQuery labelcheck.
Overlabel.
3 state radio buttons.
ShiftCheckbox jQuery Plugin.
Watermark Input.
jQuery Checkbox (checkboxes with imags).
jQuery SpinButton Control.
jQuery Ajax Form Builder.
jQuery Focus Fields.
jQuery Time Entry.

时间、日期和颜色选取(Time, Date and Color Picker)

jQuery UI Datepicker.
jQuery date picker plugin.
jQuery Time Picker.
Time Picker.
ClickPick.
TimePicker.
Farbtastic jQuery Color Picker Plugin.
Color Picker by intelliance.fr.

投票插件(Rating Plugins)

jQuery Star Rating Plugin.
jQuery Star Rater.
Content rater with asp.net, ajax and jQuery.
Half-Star Rating Plugin.

搜索插件(Search Plugins)

jQuery Suggest.
jQuery Autocomplete.
jQuery Autocomplete Mod.
jQuery Autocomplete by AjaxDaddy.
jQuery Autocomplete Plugin with HTML formatting.
jQuery Autocompleter.
AutoCompleter (Tutorial with PHP&MySQL).
quick Search jQuery Plugin.

编辑器(Inline Edit & Editors)

jTagEditor.
WYMeditor.
jQuery jFrame.
Jeditable - edit in place plugin for jQuery.
jQuery editable.
jQuery Disable Text Select Plugin.
Edit in Place with Ajax using jQuery.
jQuery Plugin - Another In-Place Editor.
TableEditor.
tEditable - in place table editing for jQuery.

多媒体、视频、Flash等(Audio, Video, Flash, SVG, etc)

jMedia - accessible multi-media embedding.
JBEdit - Ajax online Video Editor.
jQuery MP3 Plugin.
jQuery Media Plugin.
jQuery Flash Plugin.
Embed QuickTime.
SVG Integration.

图片(Photos/Images/Galleries)

ThickBox.
jQuery lightBox plugin.
jQuery Image Strip.
jQuery slideViewer.
jQuery jqGalScroll 2.0.
jQuery - jqGalViewII.
jQuery - jqGalViewIII.
jQuery Photo Slider.
jQuery Thumbs - easily create thumbnails.
jQuery jQIR Image Replacement.
jCarousel Lite.
jQPanView.
jCarousel.
Interface Imagebox.
Image Gallery using jQuery, Interface & Reflactions.
simple jQuery Gallery.
jQuery Gallery Module.
EO Gallery.
jQuery ScrollShow.
jQuery Cycle Plugin.
jQuery Flickr.
jQuery Lazy Load Images Plugin.
Zoomi - Zoomable Thumbnails.
jQuery Crop - crop any image on the fly.
Image Reflection.

Google地图（Google Map）

jQuery Plugin googlemaps.
jMaps jQuery Maps Framework.
jQmaps.
jQuery & Google Maps.
jQuery Maps Interface forr Google and Yahoo maps.
jQuery J Maps - by Tane Piper.

游戏(Games)

Tetris with jQuery.
jQuery Chess.
Mad Libs Word Game.
jQuery Puzzle.
jQuery Solar System (not a game but awesome jQuery Stuff).

表格等(Tables, Grids etc.)

UI/Tablesorter.
jQuery ingrid.
jQuery Grid Plugin.
Table Filter - awesome!.
TableEditor.
jQuery Tree Tables.
Expandable “Detail” Table Rows.
Sortable Table ColdFusion Costum Tag with jQuery UI.
jQuery Bubble.
TableSorter.
Scrollable HTML Table.
jQuery column Manager Plugin.
jQuery tableHover Plugin.
jQuery columnHover Plugin.
jQuery Grid.
TableSorter plugin for jQuery.
tEditable - in place table editing for jQuery.
jQuery charToTable Plugin.
jQuery Grid Column Sizing.
jQuery Grid Row Sizing.

统计图(Charts, Presentation etc.)

jQuery Wizard Plugin .
jQuery Chart Plugin.
Bar Chart.

边框、圆角、背景(Border, Corners, Background)

jQuery Corner.
jQuery Curvy Corner.
Nifty jQuery Corner.
Transparent Corners.
jQuery Corner Gallery.
Gradient Plugin.

文字和超链接(Text and Links)

jQuery Spoiler plugin.
Text Highlighting.
Disable Text Select Plugin.
jQuery Newsticker.
Auto line-height Plugin.
Textgrad - a text gradient plugin.
LinkLook - a link thumbnail preview.
pager jQuery Plugin.
shortKeys jQuery Plugin.
jQuery Biggerlink.
jQuery Ajax Link Checker.

鼠标提示（Tooltips）

jQuery Plugin - Tooltip.
jTip - The jQuery Tool Tip.
clueTip.
BetterTip.
Flash Tooltips using jQuery.
ToolTip.

菜单和导航(Menus, Navigations)

jQuery Tabs Plugin - awesome! . [demo nested tabs.]
another jQuery nested Tab Set example (based on jQuery Tabs Plugin).
jQuery idTabs.
jdMenu - Hierarchical Menu Plugin for jQuery.
jQuery SuckerFish Style.
jQuery Plugin Treeview.
treeView Basic.
FastFind Menu.
Sliding Menu.
Lava Lamp jQuery Menu.
jQuery iconDock.
jVariations Control Panel.
ContextMenu plugin.
clickMenu.
CSS Dock Menu.
jQuery Pop-up Menu Tutorial.
Sliding Menu.

http://stilbuero.de/jquery/tabs_3/

幻灯、翻转等(Accordions, Slide and Toggle stuff)

jQuery Plugin Accordion.
jQuery Accordion Plugin Horizontal Way.
haccordion - a simple horizontal accordion plugin for jQuery.
Horizontal Accordion by portalzine.de.
HoverAccordion.
Accordion Example from fmarcia.info.
jQuery Accordion Example.
jQuery Demo - Expandable Sidebar Menu.
Sliding Panels for jQuery.
jQuery ToggleElements.
Coda Slider.
jCarousel.
Accesible News Slider Plugin.
Showing and Hiding code Examples.
jQuery Easing Plugin.
jQuery Portlets.
AutoScroll.
Innerfade.

拖放插件(Drag and Drop)

UI/Draggables.
EasyDrag jQuery Plugin.
jQuery Portlets.
jqDnR - drag, drop resize.
Drag Demos.

XML XSL JSON Feeds

XSLT Plugin.
jQuery Ajax call and result XML parsing.
xmlObjectifier - Converts XML DOM to JSON.
jQuery XSL Transform.
jQuery Taconite - multiple Dom updates.
RSS/ATOM Feed Parser Plugin.
jQuery Google Feed Plugin.

浏览器(Browserstuff)

Wresize - IE Resize event Fix Plugin.
jQuery ifixpng.
jQuery pngFix.
Link Scrubber - removes the dotted line onfocus from links.
jQuery Perciformes - the entire suckerfish familly under one roof.
Background Iframe.
QinIE - for proper display of Q tags in IE.
jQuery Accessibility Plugin.
jQuery MouseWheel Plugin.

对话框、确认窗口(Alert, Prompt, Confirm Windows)

jQuery Impromptu.
jQuery Confirm Plugin.
jqModal.
SimpleModal.

CSS

jQuery Style Switcher.
JSS - Javascript StyleSheets.
jQuery Rule - creation/manipulation of CSS Rules.
jPrintArea.

DOM、AJAX和其它JQuery插件（DOM, Ajax and other jQuery plugins）

FlyDOM.
jQuery Dimenion Plugin.
jQuery Loggin.
Metadata - extract metadata from classes, attributes, elements.
Super-tiny Client-Side Include Javascript jQuery Plugin.
Undo Made Easy with Ajax.
JHeartbeat - periodically poll the server.
Lazy Load Plugin.
Live Query.
jQuery Timers.
jQuery Share it - display social bookmarking icons.
jQuery serverCookieJar.
jQuery autoSave.
jQuery Puffer.
jQuery iFrame Plugin.
Cookie Plugin for jQuery.
jQuery Spy - awesome plugin.
Effect Delay Trick.
jQuick - a quick tag creator for jQuery.
Metaobjects.
elementReady.

英文：http://www.kollermedia.at/archive/2007/11/21/the-ultimate-jquery-plugin-list/

这个只能判断一个数字是否在一个数组中；

下面这个用来判断一个字符串是否在数组中

来自ECSHOP2.7的js/common.js的244行处

首先保证PHP529\php-cgi.exe -b 127.0.0.1:520 -c "E:\web_sev\PHP529\php.ini" 运行无错；

而后配置nginx.conf  下面是我server内的内容

重点在这

location ~ \.php$ {
            root           html; //html是我的文件夹的位置 这个地方必须填写和两个一致
            fastcgi_pass   127.0.0.1:520;  //与 -b 127.0.0.1:520 要求一致
            fastcgi_param  SCRIPT_FILENAME  /scripts$fastcgi_script_name;
            include        fastcgi_params;
        }

许多教程要让加上fastcgi_index index.php;  我的配置加上这个无法启动NGINX。

下面是我的 include vhost.conf;  vhost.conf 文件的内容

我的站点布置是 www.a.com放在 e:\host\a_com目录下

www.b.com放在 e:\host\b_com目录下...

启动文件

RunHiddenConsole.exe  与 process.exe 附件下载[localfile=1]

Nginx 官方站点为 http://www.nginx.net，国内较好的中文站点为 http://www.nginx.cn。截止文档上次修订日，最新的稳定版本为 0.6.32，选用该版本作为我们的生产版本，同时装第三方模块“Upstream Hash”。

Nginx 使用 PCRE 库实现正则表达式，可以到 http://www.pcre.org 下载PCRE库的最新稳定版本，目前选用版本为 7.7。

PHP 官方站点为 http://www.php.net，为保持兼容性，我们选用 4.4.5 作为生产版本。

Zend 官方站点为 http://www.zend.com，我们选用其 ZendOptimizer 3.3.3 版本作为PHP加速器使用。请注意，请下载合适的版本来适合实际生产环境（64位OS必须下载其64位版本，否则会造成无法正常运行的错误）。

Lighttpd 官方站点为 http://www.lighttpd.net，我们选用其中的 spawn-fcgi 作为 php-cgi 的启动管理工具。

主要软件清单列表：

Nginx 0.6.32 nginx-0.6.32.tar.gz

Upstream Hash Module nginx_upstream_hash-0.2.tar.gz

PCRE 7.7 pcre-7.7.tar.gz

所有软件包下载完成后，放在 /usr/local/src 下。

编译 nginx

Nginx 需要安装在 2.6 以上内核版本的 GNU/Linux 系统中，同时需确认系统 libevent 库是否正确安装。编译前，请先确认gcc、make、patch等编译工具是否已安装，并可正常使用。

cd /usr/local/src

gunzip nginx-0.6.32.tar.gz

gunzip nginx_upstream_hash-0.2.tar.gz

gunzip pcre-7.7.tar.gz

tar -xvf nginx-0.6.32.tar

tar -xvf nginx_upstream_hash-0.2.tar

tar -xvf pcre-7.7.tar

cd nginx-0.6.32

patch -p0 < /usr/local/src/nginx_upstream_hash-0.2/nginx-0.5.21.patch

./configure --add-module=/usr/local/src/nginx_upstream_hash-0.2/ --with-pcre=/usr/local/src/pcre-7.7/ --prefix=/usr/local/nginx --with-http_stub_status_module --without-select_module --without-poll_module

make

make install

安装完成后，应建立了 /usr/local/nginx 目录，该目录下为 Nginx 运行需要的基本文件。

为了方便运行管理，编写一个脚本 /usr/local/nginx/bin/nginx.sh，该脚本可以作为 rc 脚本，以便系统在切换运行级别时，对 Nginx 做出控制。

cd /usr/local/nginx

mkdir bin

vi nginx.sh

--------------------------------------------------------------

见附件 nginx.sh

--------------------------------------------------------------

chmod +x nginx.sh

脚本使用方法：

/usr/local/nginx/bin/nginx.sh start 启动

/usr/local/nginx/bin/nginx.sh stop 关闭

/usr/local/nginx/bin/nginx.sh restart 重新启动，即先关闭后启动

/usr/local/nginx/bin/nginx.sh reload 重新装载配置文件

/usr/local/nginx/bin/nginx.sh check 检查配置文件

/usr/local/nginx/bin/nginx.sh relog 重新打开日志文件

编译其他

其他软件的编译和使用不再赘述，请参阅其他相关文档。下面只列出重点和需要关注的地方：

我们以 fast-cgi 方式运行 php，因此在编译PHP时，需在编译配置时增加编译参数 “--enable-fastcgi --enable-force-cgi-redirect”。

使用 lighttpd 软件包中带的 spawn-fcgi 作为启动和管理 php fcgi 进程的工具。为了方便运行管理，编写一个脚本 /usr/local/nginx/bin/php-fcgi.sh，该脚本可以作为 rc 脚本，以便系统在切换运行级别时，对 PHP 做出控制:

cd /usr/local/nginx

mkdir bin

vi php-cgi.sh

--------------------------------------------------------------

见附件 php-fchi.sh

--------------------------------------------------------------

chmod +x php-cgi.sh

脚本使用方法：

/usr/local/nginx/bin/php-cgi.sh start 启动

/usr/local/nginx/bin/php-cgi.sh stop 关闭

脚本请按实际情况进行修改和配置。该脚本建议在启动 nginx 前启动，避免出现当nginx已被启动，php cgi 进程未启前，访问 php 页面出现 502 错误。

nginx 配置说要点

详细的 nginx 配置方法、各指令的用法请参照 http://www.nginx.cn 或官方站 http://www.nginx.net 上的 wiki 文档，下面列出一些配置要点：

worker_processes指令指定处理进程的数量。一般推荐为处理器的个数，例如这台机器有两个双核cpu，则设置为4。如果用来进行下载等应用，可以适当增加，以避免进程在堵塞在IO等待中。

在事件处理配置段(event)中，显示指定用 epoll 方式处理。

worker_connections 指令指定 nginx 处理进程的个数，其与总处理量的关系用公式表达如下：

MaxClient = worker_processes * worker_connections

因此这两个数的乘积若大于系统最大可用tcp/ip栈数是没有意义的。

例当 worker_processes 设置为4时，worker_connections 设置为 10240 即足够使用。

sendfile 指令指定 nginx 是否调用 sendfile 函数（zero copy 方式）来输出文件，对于普通应用，必须设为 on。如果用来进行下载等应用磁盘IO重负载应用，可设置为 off，以平衡磁盘与网络IO处理速度，降低系统 uptime。

server_tokens 指令指定 nginx 在应答报文 header 和默认错误页面中是否显示版本号等具体信息。生产环境中应尽量避免透露过多的服务器信息，因此，必须设置为 off。类似的还有 php 页面，在配置文件中必须指定 fastcgi_hide_header X-Powered-By; 避免在应答报文 header 中透露服务器当前使用的 php 版本号。

Nginx 监听非80端口，进行目录后缀“/”补全时，返回的 Location 值中的URL带了端口号。此操作逻辑是正确的，但是与我们生产环境有冲突。生产环境中，请求通过前端 alteon 设备重定向至后端的8080、9090端口，这些端口并不对外，因此就会出现重定向的地址无法访问的情况。需要在所有虚拟主机配置中通过配置 rewrite 来避免这种情况：rewrite ^/([^.]+[^/])$ http://$host/$1/ permanent;

注意事项

l 在生产运行中，请注意 Nginx 的日志，定期进行日志文件的归档和截断。

n 将现有日志文件 mv 至新文件名；

n /usr/local/nginx/bin/nginx.sh relog

l 当要求 reload（重新装载配置文件）时，nginx 会对配置文件进行检查，如果配置文件有错，那么会继续使用旧的，已装载完毕的配置文件运行。

l 为保证生产系统的稳定运行，修改完配置文件后，必须进行 check 操作，以确保配置文件的正确性。

l 为保证生产系统的稳定运行，nginx 与 php-cgi 的通讯端口请使用 tcp/ip 方式，而不使用 unix 套接字。虽然tcp/ip效率较低，但是相对稳定，而且可以将php运行在其他机器上。当 php 应用运行较慢，并发请求多的情况下，使用 unix 套接字容易导致连接失败，从而报告 502 错误（Bad Gateway）。

<div id="wrap">正常文字的换行(亚洲文字和非亚洲文字)元素拥有默认的white-space:normal,当定义</div>

css

#wrap{white-space:normal; width:200px; }

IE浏览器

连续的英文字符和阿拉伯数字,使用word-wrap : break-word ;或者word-break:break-all;实现强制断行

html

<div id="wrap">abcdefghijklmnabcdefghijklmnabcdefghijklmn111111111</div>

css

#wrap{word-break:break-all; width:200px;}

或者

#wrap{word-wrap:break-word; width:200px;}

Firefox浏览器
连续的英文字符和阿拉伯数字的断行,Firefox的所有版本的没有解决这个问题,我们只有让超出边界的字符隐藏或者,给容器添加滚动条

html

<div id="wrap">abcdefghijklmnabcdefghijklmnabcdefghijklmn111111111</div>

css

#wrap{word-break:break-all; width:200px; overflow:auto;}

对于table元素
IE浏览器
1. 使用 table-layout:fixed;强制table的宽度,多余内容隐藏

<table style="table-layout:fixed" width="200">
<tr>
<td>abcdefghigklmnopqrstuvwxyz1234567890ssssssssssssss
</td>
</tr>
</table>

2. 使用 table-layout:fixed;强制table的宽度,内层td,th采用word-break : break-all;或者word-wrap : break-word ;换行

<table width="200" style="table-layout:fixed;">
<tr>
<td width="25%" style="word-break : break-all; ">abcdefghigklmnopqrstuvwxyz 1234567890
</td>
<td style="word-wrap : break-word ;">abcdefghigklmnopqrstuvwxyz 1234567890
</td>
</tr>
</table>

3.在td,th中嵌套div,p等采用上面提到的div,p的换行方法

Firefox浏览器

1. 使用 table-layout:fixed;强制table的宽度,内层td,th采用word-break : break-all;或者word-wrap : break-word ;换行，使用overflow:hidden;隐藏超出内，这里overflow:auto;无法起作用

<table style="table-layout:fixed" width="200">
<tr>
<td width="25%"  style="word-break : break-all; overflow:hidden; ">abcdefghigklmnopqrstuvwxyz1234567890</td>
<td width="75%" style="word-wrap : break-word; overflow:hidden; ">abcdefghigklmnopqrstuvwxyz1234567890</td>
</tr>
</table>

2.在td,th中嵌套div,p等采用上面提到的对付Firefox的方法

最后，这种现象出现的几率很小，但是不能排除网友的恶搞。

table{table-layout: fixed;}
td(word-break: break-all; word-wrap:break-word;)


注释一下：

1.第一条table{table-layout: fixed;}，此样式可以让表格中有!!!(感叹号)之类的字符时自动换行。

2.td{word-break: break-all}，一般用这句这OK了，但在有些特殊情况下还是会撑开，因此需要再加上后面一句(word-wrap:break-word;)就可以解决。此样式可以让表格中的一些连续的英文单词自动换行。

前几天看到高人们提供的客服代码,觉得挺不错,
不过,如果没有申请在线客服,那我们怎么办呢,
其实Google 的Gtalk 就提供访问网站者可以站长或客服即时交流,现在将具体方法修改如下:



1、把如下代码放入..\library 文件夹下的footer,lbi 里，有些模板是page_footer.lbi