12¿îJavascript ±í¸ñ¿Ø¼þ£¨javaeye£©
12¿îJavaScript±í¸ñ¿Ø¼þ¡£±í¸ñ¿Ø¼þ(DataGrid )ÔÊÐí×îÖÕÓû§ÔĶÁºÍдÈëµ½¾ø´ó¶àÊýÊý¾Ý¿âµÄÓ¦ÓóÌÐò¡£DataGrid ¿Ø¼þ¿ÉÒÔÔÚÉè¼Æʱ¿ìËÙ½øÐÐÅäÖã¬Ö»ÐèÉÙÁ¿´úÂë»òÎÞÐè´úÂë¡£µ±ÔÚÉè¼ÆʱÉèÖÃÁËDataGrid ¿Ø¼þµÄ DataSource ÊôÐԺ󣬾ͻáÓÃÊý¾ÝÔ´µÄ¼Ç¼¼¯À´×Ô¶¯Ìî³ä¸Ã¿Ø¼þ£¬ÒÔ¼°×Ô¶¯ÉèÖøÿؼþµÄÁбêÍ·¡£È»ºóÄú¾Í¿ÉÒԱ༸ÃÍø¸ñµÄÁУ»É¾³ý¡¢ÖØа²ÅÅ¡¢Ìí¼ÓÁбêÍ·¡¢»òÕßµ÷ÕûÈÎÒâÒ»ÁеĿí¶È
1. Flexigrid
FlexigridÊÇÒ»¸öÀàËÆÓÚExt Gird£¬µ«»ùÓÚjQuery¿ª·¢µÄGrid¡£Ëü¾ßÓеŦÄÜ°üÀ¨£º¿ÉÒÔµ÷ÕûÁÐ¿í£¬ºÏ²¢ÁбêÌ⣬·ÖÒ³£¬ÅÅÐò£¬ÏÔʾ/Òþ²Ø±í¸ñµÈ¡£FlexigridÏÔʾµÄÊý¾ÝÄܹ»Í¨¹ýAjax»ñÈ¡»òÕß´ÓÒ»¸öÆÕͨµÄ±í¸ñת»»¡£
2. Yahoo! UI Library: DataTable (ÑÝʾµØÖ·)
¸ÃDataTable¿Ø¼þÌṩµÄ¹¦ÄÜÓУºÅÅÐò¡¢Áпíµ÷Õû¡¢·ÖÒ³¡¢inline editing¡¢row selectionµÈ¡£
3. jqGrid
jqGridÊÇÒ»¸öAjaxed jQuery Grid²å¼þ¡£Ìṩ·ÖÒ³¹¦ÄÜ£¬Ìí¼Ó¡¢±à¼¡¢É¾³ýºÍËÑË÷±íÖмǼ£¬Ö§³Ö¶àÖÖÊý¾ÝÀàÐÍÊäÈ룺XML£¬JSON£¬ArrayµÈ£¬¶àÐÐÑ¡Ôñ£¬Ö§³Ö×Ó±í¸ñ£¬¼¯³ÉÈÕÆÚÑ¡Ôñ¿Ø¼þµÈµÈ¡£
4. tableFormSynch (ÑÝʾµØÖ·)
tableFormSynchÊÇÒ»¸ö±í¸ñÓë±íµ¥Êý¾ÝÏ໥¸üеÄjQuery²å¼þ¡£ËüÌṩµÄ¹¦ÄÜ°üÀ¨£º»ùÓÚ±íµ¥ÖеÄÊý¾Ý£¬ÐÂÔöÐС£É¾³ýËùÑ¡ÔñÐУ¬²¢Çå³ý±íµ¥ÖеÄËùÓÐÊý¾Ý¡£tableFormSynchÖ§³ÖËùÓÐ±íµ¥¿Ø¼þ°üÀ¨£ºcheckboxes¡¢radio¡¢buttons¡¢select
5. DataTables
DataTablesÊÇÒ»¸öjQuery²å¼þ£¬Äܹ»ÈÃHTML±í¸ñºÜ·½±ãµØʵÏÖ·ÖÒ³¡¢¹ýÂ˺ͶàÀ¸ÅÅÐòµÈ¹¦ÄÜ¡£DataTables¿ÉÒÔʹÓñ¾Éí×Ô´øµÄCSSÑùʽ£¬µ«»¹¿ÉÒÔ°´×Ô¼ºµÄÐèÒª×Ô¶¨ÒåCSSÑùʽ¡£Ëü¾ßÓÐÒÔÏÂÌØÕ÷£º
×ÔÊÊÓ¦À¸¿í
¿É±£´æ±í¸ñ״̬
¿ÉÒþº¬ÁÐ
¶¯Ì¬´´½¨±í¸ñ
Ajax×Ô¶¯×°ÔØÊý¾Ý
·á¸»µÄ·ÖÒ³ÀàÐÍ
¶àÀ¸ÅÅÐòºÍ¸ßÁÁÏÔʾ
6. OmniGrid
OmniGridÊÇÒ»¸ö²ÉÓÃMootools1.2¿ª·¢µÄ±í¸ñ¿Ø¼þÓëFlexGrid jQueryºÍSortableTableÏàËÆ¡£¾ßÓзÖÒ³£¬ÅÅÐò£¬AjaxÊý¾Ý¼ÓÔØ£¬Ìí¼Ó/ÐÞ¸Ä/ɾ³ý±í¸ñÊý¾Ý¹¦Äܵȡ£
7. moodgets Grid (ÑÝʾµØÖ·)
moodgets GridÊÇÒ»¸ö»ùÓÚMootools¿ò¼Ü¿ª·¢£¬Ò×ÓÚʹÓ㬿ÉÀ©Õ¹µÄ±í¸ñ¿Ø¼þ¡£Í϶¯µ÷Õû±í¸ñÁÐ¿í£¬ÅÅÐò£¬¶àÐлòµ¥ÐÐÑ¡Ôñ£¬µ¥»÷±í¸ñµ¥Ôª¸ñ¿É±à¼£¬·ÖÒ³£¬Í¨¹ýAjax¼ÓÔØÊý¾Ý¡£
8. MyTableGrid (ÑÝʾµØÖ·)
MyTableGridÊÇÒ»¸ö»ùÓÚÊÇPrototype¿ò¼Ü¿ª·¢µÄDataGrid¿Ø¼þ£¬ÓÃÓÚÒÔÒ»ÖÖ¸üÒ×ÓÚä¯ÀÀºÍ¸üÁé»îµÄ·½Ê½À´Õ¹Ê¾Êý¾Ý¡£ËüÌṩAjaxÖ§³ÖµÄ¿ìËÙ·ÖÒ³ºÍÊý¾ÝÅÅÐò¹¦ÄÜ£¬¿ÉÒÔÍ϶¯µ÷ÕûÊý¾ÝÁпí¶È£¬Òþ²Ø²»ÐèÒªÏÔʾµÄÁÐ
Ïà¹ØÎĵµ£º
¼¸ºõÿ¸ö¿ª·¢ÈËÔ±¶¼ÓÐÃæÏò¶ÔÏóÓïÑÔ£¨±ÈÈçC++¡¢C#¡¢Java£©µÄ¿ª·¢¾Ñé¡£ ÔÚ´«Í³ÃæÏò¶ÔÏóµÄÓïÑÔÖУ¬ÓÐÁ½¸ö·Ç³£ÖØÒªµÄ¸ÅÄî - ÀàºÍʵÀý¡£
ÀඨÒåÁËÒ»ÀàÊÂÎ﹫¹²µÄÐÐΪºÍ·½·¨£»¶øʵÀýÔòÊÇÀàµÄÒ»¸ö¾ßÌåʵÏÖ¡£ ÎÒÃÇ»¹ÖªµÀ£¬ÃæÏò¶ÔÏó±à³ÌÓÐÈý¸öÖØÒªµÄ¸ÅÄî - ·â×°¡¢¼Ì³ÐºÍ¶à̬¡£
µ«ÊÇÔÚJavaScriptµÄÊÀ½çÖУ¬ËùÓеÄÕâÒ»ÇÐÌØ ......
ÔÚµÚÒ»ÕÂÖУ¬ÎÒÃÇʹÓù¹Ô캯ÊýºÍÔÐ͵ķ½Ê½ÔÚJavaScriptµÄÊÀ½çÖÐʵÏÖÁËÀàºÍ¼Ì³Ð£¬ µ«ÊÇ´æÔںܶàÎÊÌâ¡£ÕâÒ»ÕÂÎÒÃǽ«»áÖðÒ»·ÖÎöÕâЩÎÊÌ⣬²¢¸ø³ö½â¾ö·½°¸¡£
×¢£º±¾ÕÂÖеÄjClassµÄʵÏֲο¼ÁËSimple JavaScript Inheritance
µÄ×ö·¨¡£
Ê×ÏÈÈÃÎÒÃÇÀ´»Ø¹ËһϵÚÒ»ÕÂÖнéÉܵÄÀý×Ó£º
function Person(name) {
this.name = nam ......
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title> new document </title>
<meta name="generator" content="edit ......
JavaScriptÖÐescape() º¯Êý¿É¶Ô×Ö·û´®½øÐбàÂ룬ÕâÑù¾Í¿ÉÒÔÔÚËùÓеļÆËã»úÉ϶ÁÈ¡¸Ã×Ö·û´®¡£Ê¹Ó÷½·¨£º
escape(charString)
charstringÊDZØÑ¡ÏҪ±»×ªÒå»ò±àÂëµÄ×Ö·û´®¡£
escape ·½·¨·µ»ØÒ»¸ö°üº¬ÁË charstring ÄÚÈݵÄ×Ö·û´®Öµ£¨ Unicode ¸ñʽ£©¡£ËùÓпոñ¡¢±êµã¡¢ÖØÒô·ûºÅÒÔ¼°ÆäËû·Ç ASCII ×Ö·û¶¼Óà %xx ±àÂë´úÌ棬ÆäÖ ......