Jquery-integrated instance-Fixed Header, scrolling table content [Source Code]
<HTML>
<Head>
<SCRIPT src = "jquery-1.2.js"> </SCRIPT>
<SCRIPT>
$ (Document). Ready (function (){
For (var y = 1; y <20; y ++ ){
$ ("# Table_y "). append ("<tr style = 'height: 100px; '> <TD style = 'width: 90px;'>" + Y. tostring () + "</TD> </tr> ");
$ ("# Table_xy "). append ("<tr y = '" + Y. tostring () + "'style = 'height: 100px; '> </tr> ");;
}
For (VAR x = 1; x <20; X ++ ){
$ ("# Table_x TR"). append ("<TD style = 'width: 100px; '>" + X. tostring () + "</TD> ");
$ ("# Table_xy TR"). Each (function (index, element ){
Var y = $ (element). ATTR ("Y ");
$ (Element ). append ("<TD style = 'width: 100px; '>" + X. tostring () + "& nbsp; * & nbsp;" + Y + "& nbsp ;=& nbsp;" + (x * Y ). tostring () + "</TD> ");
});
}
$ ("# Divxy"). Scroll (function (){
$ ("# DivX"). Get (0). scrollleft = This. scrollleft;
$ ("# Divy"). Get (0). scrolltop = This. scrolltop;
});
});
</SCRIPT>
</Head>
<Body>
<Table>
<Tr>
<TD>
</TD>
<TD>
<Div id = "DivX" style = "width: 400px; Height: 100px; overflow: hidden">
<Table id = "table_x" border = "1" style = "width: 2000px;">
<Tr style = "height: 90px;">
</Tr>
</Table>
</Div>
</TD>
</Tr>
<Tr>
<TD>
<Div id = "divy" style = "width: 100px; Height: 400px; overflow: hidden">
<Table id = "table_y" border = "1">
</Table>
</Div>
</TD>
<TD>
<Div id = "divxy" style = "width: 400px; Height: 400px; overflow: scroll">
<Table id = "table_xy" border = "1" style = "width: 2000px;">
</Table>
</Div>
</TD>
</Tr>
</Table>
</Body>
</Html>
[Jquery-Official Website]
Http://jquery.com/
[Jquery-]
Current version, & nbsp; http://docs.jquery.com/Release:jQuery_1.2.1
Download list, http://docs.jquery.com/Downloading_jQuery
Latest code, http://code.jquery.com/nightlieS/jquery-nightly.js
[Jquery-related forums]
Http://groups.google.com/group/jquery-en
Http://WebDev.board.newsmth.net/
Http://WebGeeks.board.newsmth.net/
Http://bbs.pku.edu.cn/, homepage watch
Http://forum.csdn.net/SList/JavaScript/
[Jquery-keywords]
Jquery
[Jquery-core]
Each iteration and http://docs.jquery.com/Core/each
Jquery, http://docs.jquery.com/Core/jQuery
[Jquery-Ajax]
Jquery Ajax documentation, http://docs.jquery.com/Ajax/jQuery.ajax
Ajax options for jquery, http://docs.jquery.com/Ajax/jQuery.ajax#options
Datatype option, set the return value type
Timeout option, used to set timeout
Integration with PHP can use json_encode to return results, http://www.php.net/manual/zh/function.json-encode.php
Readystate gets the current state of the request action, http://msdn2.microsoft.com/en-us/library/ms534361.aspx
[Jquery-special effects]
Jquery light effect, http://docs.jquery.com/Effects/fadeIn
[Jquery-selectors selector]
Form element selector, http://docs.jquery.com/DOM/Traversing/Selectors#Form_Selectors
Attribute equality selector, http://docs.jquery.com/Selectors/attributeEquals
Checked selected, http://docs.jquery.com/Selectors/checked
: Input matches all input, textarea, select and button elements, http://docs.jquery.com/Selectors/input
When selecting the title tag in the body, the selector will have a different effect than expected.
Element matches all elements by specified name, http://docs.jquery.com/Selectors/element
[Jquery-attributes]
Val gets the content of the First Matching Element value attribute, http://docs.jquery.com/Attributes/val
[Jquery-common functions] ATTR accesses custom attributes to reduce code and data coupling in JavaScript scripts
Filter, used to filter elements in a set
[Jquery-events event]
Hover, http://docs.jquery.com/Events/hover
Submit, http://docs.jquery.com/Events/submit
Focus responds to focus events for each matching element, http://docs.jquery.com/Events/focus
Click click, trigger the click event for each matching element, bind the function to the click event for each matching element, http://docs.jquery.com/Events/click
[Jquery-manipulation operation]
After inserting content after each matching element, http://docs.jquery.com/Manipulation/after
[Jquery-Traversing traversal tool]
Filter filter, http://docs.jquery.com/Traversing/filter
Find lookup, http://docs.jquery.com/Traversing/find
[Jquery-tutorials tutorial]
Introducing $ (document). Ready (), http://docs.jquery.com/Tutorials:Introducing_%24%28document%29.ready%28%29
[Jquery-plugins plugin]
Easing motion, http://jquery.com/plugins/project/easing
Jcarouselite, headlight effect, http://jquery.com/plugins/project/jCarouselLite
Tablefilter, table filter, http://jquery.com/plugins/project/tableFilter
Rounded corner rounded rectangular, http://docs.jquery.com/Tutorials:Rounded_Corners#Rounded_Corners_Without_Images
[Jquery-utilities utility]
Trim removes spaces before and after the string, http://docs.jquery.com/Utilities/jQuery.trim
[Jquery-References]
Http://www.json.org, http://www.json.org/json.js
JScript (Windows Script technologies):, http://msdn2.microsoft.com/en-us/library/hbxc2t98.aspx
Prototype property (jscript 5.6):, http://msdn2.microsoft.com/en-us/library/f5s9ycex.aspx
Parseint method (jscript 5.6):, http://msdn2.microsoft.com/en-us/library/x53yedee.aspx
Tostring method (jscript 5.6):, http://msdn2.microsoft.com/en-us/library/k6xhc6yc.aspx
HTTP status codes (Windows):, http://msdn2.microsoft.com/en-us/library/Aa384325.aspx
HTML + time:, http://msdn2.microsoft.com/en-us/library/ms533112.aspx
HTA: Application object, http://msdn2.microsoft.com/en-us/library/ms536495.aspx
About cross-frame scripting and security: http://msdn2.microsoft.com/en-us/library/ms533028.aspx for cross-framework scripting and security
How to build tables dynamically: How to dynamically build tables, http://msdn2.microsoft.com/en-us/library/ms532998.aspx
Filter property (tabular data control):-Filter Properties (Table Data Control), http://msdn2.microsoft.com/en-us/library/ms531364.aspx
[Jquery-integrated instance]
Implement the first and last effects
Cross-window function call
Timed refresh
Open the specified website in the drop-down list box.
Random Number generated between two boundaries
Text input box and label are automatically replaced
The password input box and tag are automatically replaced
Text input area and tags are automatically replaced
Pre labels provide better line feed processing in IE and Firefox.
Fixed Header, scroll table content