循環數據圖片

<div id="showct" >
  <ul class="showbackcolor">
   <s:iterator value="#request.tableList" var="shwimg" status="i">
    <s:if test="#shwimg.dinTabStatus==0">
     <a href="#">
     <li class="showempty" id="${shwimg.dinTabId}" onclick="getctinfo(${shwimg.dinTabId}) ;" ondblclick="dealwict(${shwimg.dinTabId});">
     <span><b>${shwimg.dinTabId}</b>餐檯</span>
     </li>
           </a>
    </s:if>
    <s:elseif test="#shwimg.dinTabStatus==1">
        <a href="#">
     <li class="markuse" id="${shwimg.dinTabId}" onclick="getctinfo(${shwimg.dinTabId});" ondblclick="dealwict(${shwimg.dinTabId});">
     <span><b>${shwimg.dinTabId}</b>餐檯</span>
      </li>
        </a>
    </s:elseif>
   </s:iterator>
  </ul>
 </div>javascript

 

 

 

 

<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<%@taglib uri="/struts-tags" prefix="s" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>淘淘樂</title>
<script type="text/javascript" src="js/jquery-1.9.1.js"></script>
<link href="css/ui-lightness/jquery-ui-1.10.3.custom.css" rel="stylesheet" type="text/css"/>
<script type="text/javascript" src="js/jquery-ui-1.10.3.custom.js"></script>
<script type="text/javascript" src="js/list.js"></script>
<style type="text/css">
  #table1 td{width: 100px;}
</style>
</head>
<body>
<center>
  <table>
     <tr>
        <td>
           <div id="tabs" style="width: 450px;">
             <ul>
               <li><a href="#tabs-1">商品列表</a></li>
             </ul>
              <div id="tabs-1">
                 <s:iterator value="#request.prolist" var="pro">
                    <table style="text-align:center; display:inline;">
                       <tr><td>
                          <input type="hidden" value='${pro.proId }'>
                          <img src="img/${pro.proImg}" width="120px" height="120px">
                       </td></tr>
                       <tr><td>${pro.proName}</td></tr>
                       <tr><td>¥${pro.proPrice}</td></tr>
                    </table>
                 </s:iterator>
              </div>
           </div>
        </td>
        <td valign="top">
          <div style="border: 1px solid black;width:200px;height:420px;padding: 10px;">
            <div style="text-align: left"><b>個人購物車</b></div>
            <div id="cartDiv" style="height: 376px;margin-top: 10px;">
              <table id="table1" cellpadding="0" cellspacing="0">
                <s:iterator value="#session.cart.products" var="pro" status="i">
                  <tr>
                    <td style='width:10px;'>${i.count}、</td>
                    <td style='width:80px;text-align: left'>${pro.proName }</td>
                    <td style='width:50px;'>${pro.bycount }</td>
                    <td><a href="javascript:void(0)" onclick="deletepro(this,${pro.proId})">刪除</a></td>
                  </tr>
                 </s:iterator>
              </table>
            </div>
            <div style="text-align:right;"><a href="showCart.jsp">查看購物車</a></div>
          </div>
        </td>
     </tr>
  </table>
</center>
</body>
</html>css

 

 

$(function(){
 $("#tabs").tabs();
 $("#tabs-1 table").draggable({
  helper:"clone",
  opacity:0.5
 });
 $("#cartDiv").droppable({
  drop:function(enver,ui){
   var id=ui.draggable.find("td:eq(0) input").val();
   var name=ui.draggable.find("td:eq(1)").html();
            var bool=false;
   $("#cartDiv tr").each(
     function(index,lement)
     {
    if($(lement).find("td:eq(1)").html()==name){
     bool=true;
    }
   });
   if(bool){
    $("#cartDiv tr").each(function(index,lement){
     if($(lement).find("td:eq(1)").html()==name){
      var td=$(this).find("td:eq(2)");
      td.html(parseInt(td.html())+1);
     }
    });
   }else{
    var html="<tr><td style='width:10px;'>"+($("#cartDiv tr").size()+1)+"、</td>";
       html+="<td style='width:80px;text-align: left'>"+name+"</td>";
       html+="<td style='width:50px;'>1</td>";
       html+="<td><a href='#' onclick='deletepro(this,"+id+")'>刪除</a></td>";
       html+="</tr>";
       $("#cartDiv table").append(html);
   }
   $.post("product!add","proId="+id);
  }
 });
});html

function deletepro(elment,proid)
{
 alert(proid+'remove'+elment);
 if(parseInt($(elment).parent().prev().html())>1){
  var td=$(elment).parent().prev();
  td.html(parseInt(td.html())-1);
 }else{
  $(elment).parent().parent().remove();
 }
 $.post("product!remove","proId="+proid);
}java

相關文章
相關標籤/搜索