jQuery基础知识

$.fn是指jquery的命名空间，加上fn上的方法及属性，会对jquery实例每一个有效。 
如扩展$.fn.abc() 
那么你可以这样子：$("#div").abc(); 
通常使用extend方法扩展，详细请看API. 
$.fx是指jquery的特效。 
如果使用显示、滑动、淡入淡出、动画等。 
$.fx.off可以关闭动画，其实是直接显示结果。

$(document).ready(function(){

$(“img.dropshadow”)

.wrap(“<div class=’wrap1’><div class=’wrap2’>”+”</div></div>”);

});

$(document).ready() == window.onload()

Load class=”dropshadow”: $(“img.dropshadow”)

Load id=”dropshadow”: $(“img#dropshadow”)

<divclass="xz-west">

        <ulid="xz-tree"class="ztree"></ul>

</div>

Demo.js中对xz-tree配置：

/*---------动态树--------------*/

    var setting = {

        async: {

            enable: true,

            url: "SchemaTree.s",

            autoParam: [ "name" ]

        }

    ,

        callback: {

            onClick: function(event, treeId, treeNode, clickFlag) {

                dwr.engine.setAsync(false);

                DWRAction.getHeader(treeNode.name,function(column) {

                   aoColumns= column;

                });

                dwr.engine.setAsync(true);

                               refreshTable(aoColumns,"SchemaTable.s?classname="+treeNode.name);

            }

        }

    };

    $.fn.zTree.init($("#xz-tree"), setting);

 

Table:

function refreshTable(aoColumns,url) {

      //  if (oTable == null) { //仅第一次检索时初始化Datatable 

            $(".dataTables_wrapper").empty();

            $(".xz-center").append("<tableclass='display xz-table table-contentMenu' width='100%'></table>");

            oTable = $('.xz-table').dataTable({ 

            "sScrollY" : $(".xz-center").height(),//【设置等于父窗口高度？】.是否开启垂直滚动，以及指定滚动区域大小,可设值：'disabled','2000px'

            "sScrollX": "100%",

            "bScrollCollapse" : true,// 当显示的数据不足以支撑表格的默认的高度时，依然显示纵向的滚动条。(默认是false)

            "bPaginate" : true,// 是否显示分页器

            "bLengthChange" : false,// 是否显示每页大小的下拉框

            "iDisplayLength" : 35,

            "bFilter" : true,// 是否启用客户端过滤器

            "bSort" : true,// 是否启用各列具有按列排序的功能

            "bInfo" : true,//页脚信息,是否显示表格的一些信息

            "bAutoWidth" : true,//自动宽度

            "bStateSave" : false,//保存当前页面信息为cookie，默认关闭.如果用户关闭页面后重新打开该页面，该列表会和关闭前的状态完全一样（长度，过滤，分页和排序）.当设置为true时更改每页显示条数"bLengthChange"和分页无效。当值为true时aoColumnDefs不能隐藏列

            "bJQueryUI" : true,//是否启用JQueryUI风格

            "bProcessing" : true,

            "sPaginationType" : "full_numbers",// 修改默认分页显示样式。一共两种样式，full_numbers和two_button(默认)

            "aoColumns" : aoColumns,

            "sAjaxSource" : url,

                "sDom": '<"H"lTfr>t<"F"ip>',// 修改表格单元各元素显示位置

            /* 语言设置 */

            "oLanguage" : {

                "sLengthMenu" : "每页显示 _MENU_条记录",

                "sZeroRecords" : "对不起，查询不到任何相关数据",

                "sInfo" : "当前显示 _START_到 _END_ 条，共 _TOTAL_ 条记录",

                "sInfoEmtpy" : "找不到相关数据",

                "sInfoFiltered" : "数据表中共为 _MAX_条记录)",

                "sProcessing" : "正在加载中...",

                "sSearch" : "搜索",

                "sUrl" : "", // 多语言配置文件，可将oLanguage的设置放在一个txt文件中，例：Javascript/datatable/dtCH.txt

                "oPaginate" : {

                    "sFirst" : "第一页",

                    "sPrevious" : " 上一页 ",

                    "sNext" : " 下一页 ",

                    "sLast" : " 最后一页 "

                }

            } 

            }); 

       // } 

     

        //刷新Datatable，会自动激发retrieveData 

        oTable.fnDraw(); 

    } 

Web.xml

<servlet>

   <servlet-name>SchemaTree</servlet-name>

   <servlet-class>com.cimstech.xwf.selvet.SchemaTree</servlet-class>

 </servlet>

 <servlet-mapping>

   <servlet-name>SchemaTree</servlet-name>

   <url-pattern>/SchemaTree.s</url-pattern>

  </servlet-mapping>