jquery应用：

港控/mmm° 2022-06-10 02:36 206阅读 0赞

JQuery特点：  
    屏蔽浏览器的差异，对dom操作提供了方便的扩展，一用的时间处理api及动画api，强大的插件机制  
      
    $(document).ready(function()\{XXX\})                页面自动加载事件                                  
      
    $("\#verifyButton").click(function()\{XXX\})    点击事件  
      
    $("\#verifyButton").keyup(function()\{XXX\})    按下再弹起事件  
      
    $("\#divId").addClass("XXX");                            添加css样式  
      
    $("\#divId").removeClass("XXX");                        删除css样式  
      
    $("\#tabfirst li").each(function(i)\{XXX\})    相当于for循环  
      
    $("div").eq(i).addClass("XXX")                        下标为i的div上添加XXX类  
      
    $("\#realcontent").load("TabLoad.html")    装载页面  
      
    $(".carname").children("select")                    寻找class为carname的对象中的select对象  
      
    $(".main > a").click(function()\{XXX\})            main标签中的a子标签(不包括孙标签)的click点击事件  
      
    $(this).next("ul");                                                找到main主菜单下的对应的ul子菜单项  
  
    $(".carname").children("select");                    找寻class为carname的所有子元素为select的集合  
      
    carimg.attr("src","url");                                    修改carimg的某个属性值          
      
    ulNode.slideToggle();                                            根据ul标签的显示或隐藏来动画的执行隐藏或显示  
      
    cartypeSelect.parent().hide();                        从父节点开始隐藏  
      
    carnameSelect.next().hide();                            从下一个兄弟节点开始隐藏  
              
      
    $(".hmain").hover(function()\{XXX1\},                在hmain标签中鼠标悬停时执行方法XXX1，鼠标离开时执行XXX2  
                                        function()\{XXX2\})      
          
    $(function()\{                                                            页面自动加载事件的简化写法  
        $("tbody tr:even").css("background-color","\#ECE9D8")    对tbody中下标为偶数行的背景色进行控制  
        $("tbody tr").get(0)                                        在tbody中下标为0的tr元素  
        var inputObj = $("<input type='text'>");  
        inputObj.css("border-width","0");  
        var tdObj = $(this);  
        inpitObj.val(tdObj.html());  
        tdObj.html("");  
        inpitObj.appendTo(tdObj);  
    \})      
      
      
    //对于loading图片绑定ajax请求开始和交互结束的事件  
    $("\#contentsecond img").bind("ajaxStart",function()\{  
        //把div里面的内容清空  
        $("\#realcontent").html("");  
        //整个页面中任意ajax交互开始前，function中的内容会被执行  
        $(this).show();  
    \}).bind("ajaxStop",function()\{  
        //整个页面中任意ajax交互结束后，function中的内容会被执行      
        $(this).slideUp("1000");  
    \});  
      
      
    .main   a        .main这个class元素内部所有的a节点  
    .main > a        .main的子节点中的a节点  
    客户端：  
    $.get("http://127.0.0.1:8080/JQuery/UserVerify?userName=" + encodeURI(encodeURI(userName)),    //两次编码  
        null,  
        function(response)\{$("\#result").html(response);\}  
    );  
    服务端：  
    String param = request.getParameter("userName");  
    String userName = URLDecoder.decode(param, "UTF-8");    //由URLDecoder进行一次解码