欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

js實(shí)現(xiàn)購(gòu)物車(chē)商品數(shù)量加減

 更新時(shí)間：2020年09月21日 09:36:16   作者：以後123  
這篇文章主要為大家詳細(xì)介紹了js實(shí)現(xiàn)購(gòu)物車(chē)商品數(shù)量加減，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下

本文實(shí)例為大家分享了js實(shí)現(xiàn)購(gòu)物車(chē)商品數(shù)量加減的具體代碼，供大家參考，具體內(nèi)容如下

Html

<link rel='stylesheet' type='text/css' media='screen' href='../css/bootstrap.min.css'>
<script src="../js/jquery-1.12.4.js"></script>


<div style="width: 300px;margin: 30px auto 0;">
  <form class="form-inline">
   <div class="form-group">
    <div class="input-group">
     <div onclick="minus()" class="input-group-addon">-</div>
     <input type="text" class="form-control" id="exampleInputAmount">
     <div onclick="add()" class="input-group-addon">+</div>
    </div>
   </div>
  </form>
</div>

CSS

<style>
  .list a {
   display: block;
   margin: 30px;
   padding: 0 20px;
   height: 100px;
  }

  .list .list-img {
   width: 180px;
   height: 100px;
   border-radius: 6px;
   object-fit: cover;
  }

  .list .title {
   font-size: 16px;
   font-weight: bold;
   white-space: nowrap;
   text-overflow: ellipsis;
   margin: 10px 0 0;
  }

  .list .content {
   font-size: 14px;
   line-height: 26px;
   margin: 10px 0 0;
   display: -webkit-box;
   -webkit-box-orient: vertical;
   -webkit-line-clamp: 2;
   overflow: hidden;
  }
</style>

Js

<script>
 var num = 0;
  // 對(duì)表單進(jìn)行初始賦值
  $('#exampleInputAmount').val(num);
  // 點(diǎn)擊添加時(shí)
  function add() {
   // 方法體
   if (num >= 5) {
    alert('最多可添加5個(gè)');
    return;
   }
   num++;
   console.log(num);
   $('#exampleInputAmount').val(num);
  }
  // 點(diǎn)擊刪除時(shí)
  function minus() {
   if (num < 1) {
    alert('已減到最低了');
    return;
   }
   num--;
   console.log(num);
   $('#exampleInputAmount').val(num);
  }
</script>

以上就是本文的全部?jī)?nèi)容，希望對(duì)大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。

相關(guān)文章

最新評(píng)論