jquery笔记

1.  $(obj).parent().find("span:last").html()
    $(obj)：将DOM对象转化我jquery对象
    .parent()：找到父亲
    .find("span:last")：在父亲的所有儿孙当中找span标签且这个标签为最后一个
    .html():取这个标签当中的HTML代码。


2.  $(function(){
    });相当于$(document).ready();



3.  //添加行、删除行封装方法
        function addRow(rowid,tableid){
            $("#accordion select").selectmenu("destroy");
            var tr=$("#"+rowid);
            var trnew=tr.clone(true); 
            var tr_next=$("#"+rowid+"_next");
            trnew.attr('id','');
            trnew.attr('name','autorow');
            trnew.css('display','table-row');
            trnew.insertBefore(tr_next);//在tr_next前插入行
            //trnew.insertAfter(tr);//在tr后插入行
            $("#"+tableid+"div").height(parseInt($("#"+tableid).height())+2);
            $("#accordion select").selectmenu();
        }


4.     $(function() {
         $( "#accordion" ).accordion({
                collapsible: true
             });
       });
       折叠菜单设置，是jqueryui里的功能


5.    $(function() {
        $( document ).tooltip();
     });鼠标放上去有提示的代码  也是jqueryui的



6.  $(function() {
         $( "#tabs" ).tabs();
    });选项卡 jqueryui的

7.  jquery里的accounting.js提供的格式化数据

    accounting.formatMoney([123, 456, [78, 9]], "$", 0); // ["$123", "$456", ["$78", "$9"]]

    accounting.formatColumn(list); // [["$  1.00", "$100.00"], ["$900.00", "$  9.00"]]

    accounting.formatNumber([123456, [7890, 123]]); // ["123,456", ["7,890", "123"]]

    accounting.toFixed(0.615, 2); // "0.62" 项目中用到啦 **********************************************************************************8

    // Standard usage and parameters (returns number):
    accounting.unformat(string, [decimal]);

    // Example usage:
    accounting.unformat("GBP ￡ 12,345,678.90"); // 12345678.9

    // If a non-standard decimal separator was used (eg. a comma) unformat() will need it in order to work out
    // which part of the number is a decimal/float:
    accounting.unformat("€ 1.000.000,00", ","); // 1000000

*******************************************************************************************************************************88
真是有创意 批量修改数字格式
8.  function formatInput(trobj,clname,clfou){
          var temp;
          for(var i=0;i<clname.length;i++){
                 temp=trobj.find("[name$='c"+clname[i]+"']").val();
                 trobj.find("[name$='c"+clname[i]+"']").val(accounting.toFixed(temp,clfou[i]));
          }
        }



*************************formatInput($(trobj),new Array(6, 7, 8, 9, 10, 11), new Array(2,4, 4, 4, 2, 2));******************************************************

9.      return $("#"+modeid+"map").find("input[name='"+key+"']").val();


10.

        $( "#files" ).selectmenu();jquery功能，美化select

11.。    white-space: nowrap  设置文本不会换行

12              readonly代码:<input type="text" name="readonly" readonly="readonly" />
                readonly不可编辑，可复制，可选择,可以接收焦点但不能被修改，后台会接收到传值.
                disabled代码: <input type="text" name="disabled" disabled="disabled" />
                disabled不可编辑，不可复制，不可选择，不能接收焦点,后台也不会接收到传值 




13      ajaxSubmit(obj)方法是jQuery的一个插件jquery.form.js里面的方法，
        所以使用此方法需要先引入这个插件。如下所示：

复制代码 代码如下:

<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<script src="http://malsup.github.io/jquery.form.js"></script>


14      temp = rf0.replace(/D/g, d)+"";代替 用d代替D  /g一定要带上

        $.trim(str);去除空格


15      jsp中会经常使用到使用jsp标签和jstl的标签，比如<%@ page ..%>, <%@ taglib ...%>, <c:forEach....%>, 
        尤其是循环标签，在jsp最终输出的html中会产生大量的空行，使得性能降低。最方便的解决方法是在web.xml 
        中添加以下设置。

        <jsp-property-group>
                <url-pattern>*.jsp</url-pattern>
                <trim-directive-whitespaces>true </trim-directive-whitespaces>
        </jsp-property-group>

        这个是针对所有jsp页面，还有一种就是在单个的jsp中添加<%@ page trimDirectiveWhitespaces="true"%>


16         var data="
           {
            root:
            [
                {name:'1',value:'0'},
                {name:'6101',value:'北京市'},
                {name:'6102',value:'天津市'},
                {name:'6103',value:'上海市'},
            ]
          }"; 
        var dataObj=eval("("+data+")");//在jsp页面时候，将字符串转换为json对象 



17        $("[name='"+modeid+"form']").ajaxSubmit({
                   type : 'post',  
                   //async:  false,
                   url : "${ctx}/lowestcapital/lowestcapital_loadMode.do?modeflag="+modeflag+"&modemonth="+modemonth,  
                   error: function(XmlHttpRequest, textStatus, errorThrown){  
                        showMsg( "系统错误");  
                        LoadDB.html("");//移除loading
                   },
                   success: function(data){
                        LoadDB.html(data);
                        eval(modeid+"exe('"+modeid+"');");//动态执行函数
                        showMsg($("#"+modeid+"rs").val());
                   }
               });



18      each中：跳出循环方法：
******************************* 返回 'false' 将停止循环 (就像在普通的循环中使用 'break')。
********************************返回 'true' 跳至下一个循环(就像在普通的循环中使用'continue')。 
    http://www.cnblogs.com/xiaojinhe2/archive/2011/10/12/2208740.html



19.基于jquery的合并table相同单元格的插件(精简版)
        http://www.jb51.net/article/26724.htm
/ 这里写成了一个jquery插件的形式
$('#process').mergeCell({
// 目前只有cols这么一个配置项, 用数组表示列的索引,从0开始
// 然后根据指定列来处理(合并)相同内容单元格
cols: [0, 3]
}); 




20      Eclipse+Struts2+Spring+MyBatis环境搭建

    http://wenku.baidu.com/view/fd112e3877232f60ddcca1e7.html




21      找到单元格的值


方法一：$("#modeIC tr:visible[rowflag='sum6list']").each(function (index2,trobj2){
                    if(index1==index2){
                        $(trobj2).find("td").each(function(index3,tdobj1){
                            if(index3>=1){
                                xgxs[index3-1]=$.trim($(tdobj1).html());
                            }
                        });
                    }
                 });




each前 意思是找到名字为modeIc的table 的属性为rowflag='sum6list'的行对象，行对象然后.find("td")找到改行所有的单元格   ，然后.html()

方法二：var typename=$.trim($(this).children().eq(0).text()); 

this代表行对象










22      去除空格
        function trim(str) {
        str = str.replace(/^(\s|\u00A0)+/, '');
        for ( var i = str.length - 1; i >= 0; i--) {
            if (/\S/.test(str.charAt(i))) {
                str = str.substring(0, i + 1);
                break;
            }
        }
        return str;
    }





23   window.showModalDialog('/reserve/reserve/loss/IBNR/project/mytask/showOpinionLog.jsp?taskcode='+taskcode);
    类似于window.open();








 24.            var selectObj = document.getElementById('selectId');   
    // 通过对象添加option   
    selectId.add(new Option("第一个","1"))   
    selectId.add(new Option("第二个","2"))   
    // 通过id添加option   
    selectId.add(new Option("第三个","3"))   
    selectId.add(new Option("第四个","4"))   
    // 通过id添加方法（也可以通过对象添加方法）   
    selectId.onchange = function(){   
        // 通过对象获取value和text   
        alert(selectObj.value);   
        alert(selectObj.options[selectObj.selectedIndex].text);   
        // 通过 id 获取value和text   
        alert(selectId.value);   
        alert(selectId.options[selectId.selectedIndex].text);   
        // 还可以通过this获取value和text   
        alert(this.value);   
        alert(this.options[this.selectedIndex].text);   







25   jquery隔行换色，



****************************************************************************************************************************




<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>表格隔行背景和突出显示当前行</title>
         <script type="text/javascript" src="${ctx}/newrisk/js/jquery-ui/jquery-ui.js"></script>
        <style type="text/css">
            body{ margin:0 auto; font-size:12px;}
            .data_list td{ width:100px;}
        </style>

        <script type="text/javascript">
        /* 当鼠标移到表格上是，当前一行背景变色 */
      $(document).ready(function(){
            $(".data_list tr td").mouseover(function(){
                $(this).parent().find("td").css("background-color","red");
            });
      })
      /* 当鼠标在表格上移动时，离开的那一行背景恢复 */
      $(document).ready(function(){ 
            $(".data_list tr td").mouseout(function(){
                var bgc = $(this).parent().attr("bg");
                $(this).parent().find("td").css("background-color",bgc);
            });
      })

      $(document).ready(function(){ 
            var color="#ffeab3"
            $(".data_list tr:odd td").css("background-color",color);  //改变偶数行背景色
            /* 把背景色保存到属性中 */
            $(".data_list tr:odd").attr("bg",color);
            $(".data_list tr:even").attr("bg","#fff");
      })
      </script>
    </head>
    <body>
        <table class="data_list">
        <tr><td> 100 </td>  <td> 100 </td><td> 100 </td><td> 100 </td><td> 100 </td></tr>
        <tr><td> 100 </td>  <td> 100 </td><td> 100 </td><td> 100 </td><td> 100 </td></tr>
        <tr><td> 100 </td>  <td> 100 </td><td> 100 </td><td> 100 </td><td> 100 </td></tr>
        <tr><td> 100 </td>  <td> 100 </td><td> 100 </td><td> 100 </td><td> 100 </td></tr>
        <tr><td> 100 </td>  <td> 100 </td><td> 100 </td><td> 100 </td><td> 100 </td></tr>
        <tr><td> 100 </td>  <td> 100 </td><td> 100 </td><td> 100 </td><td> 100 </td></tr>
        <tr><td> 100 </td>  <td> 100 </td><td> 100 </td><td> 100 </td><td> 100 </td></tr>
        <tr><td> 100 </td>  <td> 100 </td><td> 100 </td><td> 100 </td><td> 100 </td></tr>
        </table>
    </body>
</html>



****************************************************************************************************************************