zoukankan      html  css  js  c++  java
  • 一段jquery代码,保存

      1 @CHARSET "UTF-8";
      2   #table_id tbody tr.odd td:hover{
      3     background-color:#93CFE5;
      4     }
      5     
      6     #table_id tbody .even td:hover{
      7     background-color:#93CFE5;
      8     }
      9 
     10 
     11 
     12 ----------------------------------------
     13 意思就是鼠标指针变成 手 的形状,和放到链接上面的鼠标指针一样。
     14 style="cursor:pointer;
     15 ---------------------------------------------------------
     16 找到每个段落紧邻的前一个同辈元素。
     17 
     18 HTML 代码:
     19 <p>Hello</p><div><span>Hello Again</span></div><p>And Again</p>jQuery 代码:
     20 $("p").prev()结果:
     21 [ <div><span>Hello Again</span></div> ]
     22 ---------------------------------------------------------------------------------------------------------------------------------------------------
     23                                                                   <table id="data-table"
     24                                     class="table table-bordered nowrap" width="100%">
     25                                     <thead>
     26                                         <tr>
     27 
     28                                             <th style="display:none;">编号</th>
     29                                             <th><input type="checkbox" id="selectall"/></th>
     30                                             <th>型号</th>
     31                                             <th>航班号</th>
     32                                             <th>F价格</th>
     33                                             <th>B价格</th>
     34                                             <th>E价格</th>
     35                                             <th>C价格</th>
     36                                             <th>F数量</th>
     37                                             <th>B数量</th>
     38                                             <th>E数量</th>
     39                                             <th>C数量</th>
     40                                             <th style="display:none;">图片地址</th>
     41                                             <th style="display:none;">状态</th>
     42                                             <th>操作</th>
     43                                         </tr>
     44                                     </thead>
     45                                     <tbody>
     46                                         <s:iterator value="planelist" var="plane">
     47                                             <tr>
     48                                                 <td style="display:none;"><s:property value="#plane.id" /></td>
     49                                                 <td><input type="checkbox" name="pid" value="<s:property value="#plane.id" />"/></td>
     50                                                 <td class="ptype" style="cursor:pointer;"><s:property value="#plane.planetype" /></td>
     51                                                 <td><s:property value="#plane.lname" /></td>
     52                                                 <td><s:property value="#plane.tdcprice" /></td>
     53                                                 <td><s:property value="#plane.swcprice" /></td>
     54                                                 <td><s:property value="#plane.jjcprice" /></td>
     55                                                 <td><s:property value="#plane.thcprice" /></td>
     56                                                 <td><s:property value="#plane.tdcnum" /></td>
     57                                                 <td><s:property value="#plane.swcnum" /></td>
     58                                                 <td><s:property value="#plane.jjcnum" /></td>
     59                                                 <td><s:property value="#plane.thcnum" /></td>
     60                                                 <td style="display:none;"><s:property value="#plane.imgurl" /></td>
     61                                                 <td class="pstatus" style="display:none;"><s:property value="#plane.status" /></td>
     62                                                 <td>
     63                                                     <button class="btn btn-primary edit-btn" data-toggle="modal"
     64                                                         data-target="#myModal">修改</button> 
     65                                                 </td>
     66                                             </tr>
     67                                         </s:iterator>
     68                                     </tbody>
     69                                 </table>
     70 -----------------------------------------------------------------------------------------------------------------------------------------------------------------
     71 <script>
     72 $(function(){
     73 $('#data-table tbody tr td.ptype').click( function () {
     74 var pid=$(this).prev("td").prev("td").eq(0).text()
     75 $.ajax({
     76 type:"post",
     77 url:'plane!planeinfo.action?plane.id='+pid,
     78 dataType:"json",
     79 data:{
     80 },
     81 success:function(data,textStatus){
     82 var h=$("#morris-donut-chart").parent().parent().parent().offset().top;
     83 $("#morris-donut-chart").prev("h4").text(data.planetype+"的座位数量");
     84 $(document).scrollTop(h);
     85 $("#morris-donut-chart").html("");
     86 var blue = "#348fe2", 
     87 blueLight = "#5da5e8", blueDark = "#1993E4", aqua = "#49b6d6", 
     88 aquaLight = "#6dc5de", aquaDark = "#3a92ab", green = "#00acac", 
     89 greenLight = "#33bdbd", greenDark = "#008a8a", orange = "#f59c1a", 
     90 orangeLight = "#f7b048", orangeDark = "#c47d15", dark = "#2d353c", 
     91 grey = "#b6c2c9", purple = "#727cb6", purpleLight = "#8e96c5", purpleDark = "#5b6392",
     92  red = "#ff5b57";
     93  var Path=getRootPath();
     94 $("#planeimg").attr("src",Path+data.imgurl);
     95 $("#planeimg").parent().prev("h4").text(data.planetype+'的舱位分布图');
     96     Morris.Donut({
     97       element: 'morris-donut-chart',
     98       data: [
     99         {value: data.tdcnum, label: '头等舱'},
    100         {value: data.swcnum, label: '商务舱'},
    101         {value: data.jjcnum, label: '经济舱'},
    102         {value: data.thcnum, label: '特惠舱'}
    103       ],
    104        colors: ['#E75045', '#5FBBEC', '#69C7A3', grey],
    105        resize: true,
    106       formatter: function (x) { return x + "个"}
    107     }).on('click', function(i, row){
    108       console.log(i, row);
    109     });
    110 },
    111 error:function(){
    112 alert("错误!");
    113 }
    114 })
    115 })
    116 })
    117 
    118 function getRootPath(){
    119     //获取当前网址,如: http://localhost:8083/uimcardprj/share/meun.jsp
    120     var curWwwPath=window.document.location.href;
    121     //获取主机地址之后的目录,如: uimcardprj/share/meun.jsp
    122     var pathName=window.document.location.pathname;
    123     var pos=curWwwPath.indexOf(pathName);
    124     //获取主机地址,如: http://localhost:8083
    125     var localhostPaht=curWwwPath.substring(0,pos);
    126     //获取带"/"的项目名,如:/uimcardprj
    127     var projectName=pathName.substring(0,pathName.substr(1).indexOf('/')+1);
    128     return(localhostPaht+projectName);
    129 }
    130 
    131 </script>
    132 ---------------------------------------------------------------------------------------
    133 参数index描述:
    134 获取匹配的第二个元素
    135 
    136 HTML 代码:
    137 <p> This is just a test.</p> <p> So is this</p>jQuery 代码:
    138 $("p").eq(1)结果:
    139 [ <p> So is this</p> ]
    140 ------------------------------
    141 prev([expr])
    142 概述
    143 取得一个包含匹配的元素集合中每一个元素紧邻的前一个同辈元素的元素集合。
    144 
    145 可以用一个可选的表达式进行筛选。只有紧邻的同辈元素会被匹配到,而不是前面所有的同辈元素。
    146 ----------------------------------------------------------------------------------------
    147 offset([coordinates])
    148 概述
    149 获取匹配元素在当前视口的相对偏移。
    150 
    151 返回的对象包含两个整型属性:top 和 left,以像素计。此方法只对可见元素有效。
    152 
    153 -----------------------------------------------------------------------------
    154 示例
    155 描述:
    156 查找每个段落的父元素
    157 
    158 HTML 代码:
    159 <div><p>Hello</p><p>Hello</p></div>jQuery 代码:
    160 $("p").parent()结果:
    161 [ <div><p>Hello</p><p>Hello</p></div>]
    162 ---------------------------------------------------------------------------
    ---- 动动手指关注我!或许下次你又能在我这里找到你需要的答案!ZZZZW与你一起学习,一起进步!
  • 相关阅读:
    ubuntu安装QQ
    Ubuntu 14.04/14.10下安装VMware Workstation
    在Macbook上安装ubuntu
    MacBook Air密码忘了,苹果电脑密码忘了怎么办
    Win7下U盘安装Ubuntu14.04双系统
    linux紧急救援模式
    Standard Library Modules Using Notes
    【LeetCode】136 & 137 & 260
    Python获取脚本所在目录的正确方法【转】
    Autorun a python script after reboot using rc.local
  • 原文地址:https://www.cnblogs.com/zzzzw/p/4819061.html
Copyright © 2011-2022 走看看