如何顯示一個div的隱藏數據到另一個div？

Question

我正在研究一個項目，在這個項目中，當我點擊加號時，數據將隱藏，並出現在旁邊的div中。 這裏是代碼：

<fieldset class="col-md-4" > 
    <legend>Services</legend> 
    <div class="col-md-12" > 
     <?php 
      $id = 0; 
      foreach ($servicesname as $val) { 
      $id++; 
     ?> 
     <div class="col-md-12" style="font-size: 16px;" id="itemservices<?php echo $id ?>"> 
      <span style="float:left;" ><?php echo $val[0]['servicename']; ?></span> 
      <a style="float:right;" href onclick="return addSrvToCart('itemservices<?php echo $id ?>')" > 
       <strong>&#8377 <?php echo $val[0]['amount']; ?></strong> 
       <span class="glyphicon glyphicon-plus-sign" id="id_<?php echo $id; ?>"></span> 
      </a> 
     </div> 

     <?php } ?> 
    </div> 
</fieldset> 

，併爲下一個DIV代碼：

<fieldset class="col-md-4" > 
    <legend>Cart</legend> 
    <div style="list-style:none;" class="no-left-padding" id="cart"> 
     <div class="col-md-12" > 

     </div> 
    </div> 

    <div class="col-sm-12 no-right-padding" style="background-color:#f3f0f0; padding-top:6px; border:1px solid#ccc"> 
     <label class="pull-right">/*what should i write here to show the sum */: ₨&nbsp;</label> 
    </div> 
    <button style="margin-top:10px;" class="btn btn-primary btn-sm pull-right" onclick="bookNowAfterFilter()">Book Now</button> 
</fieldset> 

這jQuery代碼：

<script> 
function addSrvToCart(elem){ 
    alert($('#' + elem).html()); 
    $('#' + elem).hide(); 

    //return false; 
    //what should i write here the show that hidden div 
    document.getElementById('summery); 
    return false; 
} 
</script> 

這是圖片，我想展示購物車div中的數據並顯示金額

Answer 1

您需要HTML和腳本來改變達到的效果

嘗試這樣
HTML

<fieldset class="col-md-4" > 
    <legend>Services</legend> 
    <div class="col-md-12" > 
     <?php 
      $id = 0; 
      foreach ($servicesname as $val) { 
      $id++; 
     ?> 
     <div class="col-md-12" style="font-size: 16px;" id="itemservices<?php echo $id ?>"> 
      <span style="float:left;" ><?php echo $val[0]['servicename']; ?></span> 
      <a style="float:right;" onclick=" addSrvToCart('itemservices<?php echo $id ?>')" > 
       &#8377<strong> <?php echo $val[0]['amount']; ?></strong> 
       <span class="glyphicon glyphicon-plus-sign" id="id_<?php echo $id; ?>"></span> 
      </a> 
     </div> 

     <?php } ?> 
    </div> 
</fieldset> 

，併爲下一個DIV代碼：

<fieldset class="col-md-4" > 
    <legend>Cart</legend> 
    <div style="list-style:none;" class="no-left-padding"> 
     <div class="col-md-12" id="cart" > 

     </div> 
    </div> 

    <div class="col-sm-12 no-right-padding pull-right" style="background-color:#f3f0f0; padding-top:6px; border:1px solid#ccc"> 
      Total: ₨&nbsp;<label class="" id="sumAmount">0</label> 
     </div> 
    <button style="margin-top:10px;" class="btn btn-primary btn-sm pull-right" onclick="bookNowAfterFilter()">Book Now</button> 
</fieldset> 

腳本：

function addSrvToCart(elem){ 
    var div=$('#' + elem); 
    div.hide(); 
    $('#cart').append(div.html()); 
    var total = parseInt(div.find('strong').html()) + parseInt($('#sumAmount').html()); 
    $('#sumAmount').html(total); 
} 

它會產生輸出

我認爲這將幫助你。