javascript développe une fonction de panier d'achat pour implémenter la fonction de signe moins
Dans la section précédente, nous avons complété la fonction du signe plus. Cliquer sur le signe moins est en fait très simple
Nous copions le code js du signe plus, puis rempla?ons le signe plus par le signe plus. signe moins C'est tout, mais il y aura un problème. Si nous continuons à réduire, il peut être réduit à un nombre négatif, ce qui ne répond pas à nos exigences
Nous devons donc d'abord porter un jugement. comme suit?:
<script> function a2(td,td2,id){ var price = document.getElementById(td).innerHTML;//獲得單價(jià) var total = document.getElementById(td2).innerHTML;//獲得總價(jià) var v1 = parseInt(document.getElementById(id).value);//獲得數(shù)量 if(v1>1){ document.getElementById(id).value = v1-1; document.getElementById(td2).innerHTML = parseInt(price) * parseInt(v1-1); }else{ var v1 = 1; } } </script>
Le code ci-dessus
Obtenez d'abord la quantité totale du prix unitaire, puis jugez lorsque le nombre est supérieur à 1, nous pouvons le soustraire lorsqu'il n'est pas supérieur à. 1, nous donnons une valeur par défaut de 1
Le code complet est le suivant :
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <style type="text/css"> table{width:350px;border:1px solid #eee;text-align:center;} .tr2{height:50px;} input{width:30px;height:20px;text-align: center;} a{text-decoration:none} </style> <script type="text/javascript"> function a1(td,td2,id){ var price = document.getElementById(td).innerHTML;//獲得單價(jià) var total = document.getElementById(td2).innerHTML;//獲得總價(jià) var v1 = parseInt(document.getElementById(id).value);//獲得數(shù)量 document.getElementById(id).value = v1+1; document.getElementById(td2).innerHTML = parseInt(price) * parseInt(v1+1); } function a2(td,td2,id){ var price = document.getElementById(td).innerHTML;//獲得單價(jià) var total = document.getElementById(td2).innerHTML;//獲得總價(jià) var v1 = parseInt(document.getElementById(id).value);//獲得數(shù)量 if(v1>1){ document.getElementById(id).value = v1-1; document.getElementById(td2).innerHTML = parseInt(price) * parseInt(v1-1); }else{ var v1 = 1; } } </script> </head> <body> <table cellspacing="0" cellpadding="0" border="1"> <tr> <th>名稱</th> <th>單價(jià)</th> <th>數(shù)量</th> <th>總價(jià)</th> </tr> <tr class="tr2"> <td>手表</td> <td id="price">1999</td> <td> <a href="#" id="a1" class="tp1" onclick="a2('price','total','count')">-</a> <input type="text" value="1" id="count" onblur="a3('price','total','count')"> <a href="#" id="a2" class="tp2" onclick="a1('price','total','count')">+</a> </td> <td id="total">1999</td> </tr> <tr class="tr2"> <td>手機(jī)</td> <td id="price_1">1999</td> <td> <a href="#" id="a1" class="tp1" onclick="a2('price_1','total_1','count_1')">-</a> <input type="text" value="1" id="count_1" onblur="a3('price_1','total_1','count_1')"> <a href="#" id="a2" class="tp2" onclick="a1('price_1','total_1','count_1')">+</a> </td> <td id="total_1">1999</td> </tr> </table> </br> </body> </html>
De cette fa?on, nos additions et soustractions ont été complétées