zoukankan      html  css  js  c++  java
  • 10、jqueryEasyUI感觉自己还是改行做前端吧

    1、jquery的局部方法开发

    //首先引入jquery的相关包组件

    <script type="text/javascript" src="../js/jquery-1.8.3.js"></script>
    <script type="text/javascript" src="../js/jQuery-plguin.js"></script>

    /**
    * 扩展jQuery 的一个方法,调用这个方法,我就可以画出表格,表格有多少列,多少行数据...
    */
    $(function(){
            $("#datagrid").datagrid({
                   columns:[
                          {title:"车次"},
                          {title:"出发站/始发站"},
                          {title:"出发时间/到达时间"},
                          {title:"商务座"},
                          {title:"特等座"},
                          {title:"备注"}
                   ], 
                   url:"datagrid.json",
                   method:"POST"
            })     
    })    

    /**
    **
    */引入的jQuery-plguin.js中的内容
    $.fn.extend({
      datagrid:function(object){
        var columns=object.columns;
        var tr="<tr>";
        for(var i=0;i<columns.length;i++){
          tr+="<td>"+columns[i].title+"</td>";
        }
        tr+="</tr>";
        $(this).append(tr);
        $.ajax({
          url:object.url,
          type:object.method,
          success:function(data){
            var rows=data.rows;
            

            for(var i=0;i<rows.length;i++){
              var tr1="<tr>";
              tr1+="<td>"+rows[i].ceci+"</td>";
              tr1+="<td>"+rows[i].startstate+"</td>";
              tr1+="<td>"+rows[i].starttime+"</td>";
              tr1+="<td>"+rows[i].swz+"</td>";
              tr1+="<td>"+rows[i].tdz+"</td>";
              tr1+="<td>"+rows[i].bz+"</td>";
              tr1+="</tr>";

              $("#datagrid").append(tr1);
            }


          }
        })
      }
    })

    //datagrid.json中的内容
    {
        "total":9527,
        "rows":[
            {
                "ceci":"G118",
                "startstate":"北京/青岛",
                "starttime":"9点10分/14点整",
                "swz":"有",
                "tdz":"有",
                "bz":"预定"
            },
            {
                "ceci":"G118",
                "startstate":"北京/青岛",
                "starttime":"9点10分/14点整",
                "swz":"有",
                "tdz":"有",
                "bz":"预定"
            },
            {
                "ceci":"G118",
                "startstate":"北京/青岛",
                "starttime":"9点10分/14点整",
                "swz":"有",
                "tdz":"有",
                "bz":"预定"
            }
            ,
            {
                "ceci":"G118",
                "startstate":"北京/青岛",
                "starttime":"9点10分/14点整",
                "swz":"有",
                "tdz":"有",
                "bz":"预定"
            }
            ,
            {
                "ceci":"G118",
                "startstate":"北京/青岛",
                "starttime":"9点10分/14点整",
                "swz":"有",
                "tdz":"有",
                "bz":"预定"
            }
            ,
            {
                "ceci":"G118",
                "startstate":"北京/青岛",
                "starttime":"9点10分/14点整",
                "swz":"有",
                "tdz":"有",
                "bz":"预定"
            }
            ,
            {
                "ceci":"G118",
                "startstate":"北京/青岛",
                "starttime":"9点10分/14点整",
                "swz":"有",
                "tdz":"有",
                "bz":"预定"
            }
        
        ]
    
    
    }



  • 相关阅读:
    AcWing 1027. 方格取数 dp
    AcWing 1014. 登山 dp
    acwing 482. 合唱队形 dp
    LeetCode 1463. 摘樱桃II dp
    LeetCode 100. 相同的树 树的遍历
    LeetCode 336. 回文对 哈希
    LeetCode 815. 公交路线 最短路 哈希
    算法问题实战策略 DARPA大挑战 二分
    算法问题实战策略 LUNCHBOX 贪心
    AcWing 1100. 抓住那头牛 BFS
  • 原文地址:https://www.cnblogs.com/weizhen/p/5851369.html
Copyright © 2011-2022 走看看