一段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 ---------------------------------------------------------------------------

 

转载于:https://www.cnblogs.com/zzzzw/p/4819061.html