|
|
@@ -8,96 +8,70 @@
|
|
|
<link rel="stylesheet" type="text/css" href="css/testingCss.css">
|
|
|
</head>
|
|
|
<body>
|
|
|
- <div id="Store">
|
|
|
- <div class="lable">
|
|
|
- <input type="checkbox">
|
|
|
- <div id="StoreIcon">
|
|
|
- <img src="https://assets.burberry.com/is/image/Burberryltd/0c498f053ef33c97aab8f9a472265caed3e75a39.jpg?$BBY_V2_SL_3x4$=&wid=1903&hei=2537">
|
|
|
- </div>
|
|
|
- <h3>StoreA</h3>
|
|
|
- </div>
|
|
|
- <div class="goods">
|
|
|
- <input type="checkbox">
|
|
|
- <div id="GoodsIcon">
|
|
|
- <img src="https://assets.burberry.com/is/image/Burberryltd/0c498f053ef33c97aab8f9a472265caed3e75a39.jpg?$BBY_V2_SL_3x4$=&wid=1903&hei=2537">
|
|
|
- </div>
|
|
|
- <div id="exp">
|
|
|
- <h3>GoodsA</h3>
|
|
|
- <p>info & selected</p>
|
|
|
- <div id="count">
|
|
|
- <button>-</button>
|
|
|
- <input type="text">
|
|
|
- <button>+</button>
|
|
|
+ <form action="ShoppingCart.html" method="get">
|
|
|
+ <div id="Store">
|
|
|
+ <a class="lable">
|
|
|
+ <input type="checkbox">
|
|
|
+ <div id="StoreIcon">
|
|
|
+ <img src="https://assets.burberry.com/is/image/Burberryltd/0c498f053ef33c97aab8f9a472265caed3e75a39.jpg?$BBY_V2_SL_3x4$=&wid=1903&hei=2537">
|
|
|
</div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="goods">
|
|
|
- <input type="checkbox">
|
|
|
- <div id="GoodsIcon">
|
|
|
- <img src="https://assets.burberry.com/is/image/Burberryltd/0c498f053ef33c97aab8f9a472265caed3e75a39.jpg?$BBY_V2_SL_3x4$=&wid=1903&hei=2537">
|
|
|
- </div>
|
|
|
- <div id="exp">
|
|
|
- <h3>GoodsB</h3>
|
|
|
- <p>info & selected</p>
|
|
|
- <div id="count">
|
|
|
- <button>-</button>
|
|
|
- <input type="text">
|
|
|
- <button>+</button>
|
|
|
+ <h3>StoreA</h3>
|
|
|
+ </a>
|
|
|
+ <div class="goods">
|
|
|
+ <input name="seleceed" type="checkbox">
|
|
|
+ <div id="GoodsIcon">
|
|
|
+ <img src="https://assets.burberry.com/is/image/Burberryltd/0c498f053ef33c97aab8f9a472265caed3e75a39.jpg?$BBY_V2_SL_3x4$=&wid=1903&hei=2537">
|
|
|
</div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
-
|
|
|
-
|
|
|
- <div id="Store">
|
|
|
- <div class="lable">
|
|
|
- <input type="checkbox">
|
|
|
- <div id="StoreIcon">
|
|
|
- <img src="https://assets.burberry.com/is/image/Burberryltd/0c498f053ef33c97aab8f9a472265caed3e75a39.jpg?$BBY_V2_SL_3x4$=&wid=1903&hei=2537">
|
|
|
- </div>
|
|
|
- <h3>StoreB</h3>
|
|
|
- </div>
|
|
|
- <div class="goods">
|
|
|
- <input type="checkbox">
|
|
|
- <div id="GoodsIcon">
|
|
|
- <img src="https://assets.burberry.com/is/image/Burberryltd/0c498f053ef33c97aab8f9a472265caed3e75a39.jpg?$BBY_V2_SL_3x4$=&wid=1903&hei=2537">
|
|
|
- </div>
|
|
|
- <div id="exp">
|
|
|
- <h3>GoodsC</h3>
|
|
|
- <p>info & selected</p>
|
|
|
- <div id="count">
|
|
|
- <button>-</button>
|
|
|
- <input type="text">
|
|
|
- <button>+</button>
|
|
|
+ <div id="exp">
|
|
|
+ <h3>GoodsA</h3>
|
|
|
+ <p>info & selected</p>
|
|
|
+ <div id="count">
|
|
|
+ <div>-</div>
|
|
|
+ <input name="count" type="text">
|
|
|
+ <div>+</div>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
- <div class="goods">
|
|
|
- <input type="checkbox">
|
|
|
- <div id="GoodsIcon">
|
|
|
- <img src="https://assets.burberry.com/is/image/Burberryltd/0c498f053ef33c97aab8f9a472265caed3e75a39.jpg?$BBY_V2_SL_3x4$=&wid=1903&hei=2537">
|
|
|
- </div>
|
|
|
- <div id="exp">
|
|
|
- <h3>GoodsD</h3>
|
|
|
- <p>info & selected</p>
|
|
|
- <div id="count">
|
|
|
- <button>-</button>
|
|
|
- <input type="text">
|
|
|
- <button>+</button>
|
|
|
+
|
|
|
+
|
|
|
+ <div id="Store">
|
|
|
+ <a class="lable">
|
|
|
+ <input type="checkbox">
|
|
|
+ <div id="StoreIcon">
|
|
|
+ <img src="https://assets.burberry.com/is/image/Burberryltd/0c498f053ef33c97aab8f9a472265caed3e75a39.jpg?$BBY_V2_SL_3x4$=&wid=1903&hei=2537">
|
|
|
+ </div>
|
|
|
+ <h3>StoreB</h3>
|
|
|
+ </a>
|
|
|
+ <div class="goods">
|
|
|
+ <input name="selected" type="checkbox">
|
|
|
+ <div id="GoodsIcon">
|
|
|
+ <img src="https://assets.burberry.com/is/image/Burberryltd/0c498f053ef33c97aab8f9a472265caed3e75a39.jpg?$BBY_V2_SL_3x4$=&wid=1903&hei=2537">
|
|
|
+ </div>
|
|
|
+ <div id="exp">
|
|
|
+ <h3>GoodsB</h3>
|
|
|
+ <p>info & selected</p>
|
|
|
+ <div id="count">
|
|
|
+ <div>-</div>
|
|
|
+ <input name="count" type="text">
|
|
|
+ <div>+</div>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
- </div>
|
|
|
+ <input type="submit" name="submit" value="Delete">
|
|
|
+ <input type="submit" name="submit" value="Settle">
|
|
|
+ </form>
|
|
|
|
|
|
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
|
|
|
<script>
|
|
|
- $("body>div#Store>div.goods>div#exp>div#count>Button").click(function()
|
|
|
+ $("form>div#Store>div.goods>div#exp>div#count>div").click(function()
|
|
|
{
|
|
|
if(this.innerHTML == "-")
|
|
|
{
|
|
|
let text = $(this).next()[0];
|
|
|
let num = Number.parseInt(text.value);
|
|
|
- console.dir(num);
|
|
|
+ // console.dir(num);
|
|
|
if(num.toString() == "NaN") num = 0;
|
|
|
else num = Math.max(0,--num);
|
|
|
text.value = num;
|
|
|
@@ -107,13 +81,13 @@
|
|
|
{
|
|
|
let text = $(this).prev()[0];
|
|
|
let num = Number.parseInt(text.value);
|
|
|
- console.dir(num);
|
|
|
+ // console.dir(num);
|
|
|
if(num.toString() == "NaN") num = 1;
|
|
|
else num = Math.max(0,++num);
|
|
|
text.value = num;
|
|
|
}
|
|
|
});
|
|
|
- $("body>div#Store>div.lable>input").change(function()
|
|
|
+ $("form>div#Store>a.lable>input").change(function()
|
|
|
{
|
|
|
let items = $(this).parent().parent().children("div.goods").children("input");
|
|
|
// console.dir(items);
|
|
|
@@ -121,7 +95,22 @@
|
|
|
{
|
|
|
items[i].checked = this.checked;
|
|
|
}
|
|
|
- })
|
|
|
+ });
|
|
|
+ $("form>div#Store>div.goods>div#exp>div#count>input").focusout(function()
|
|
|
+ {
|
|
|
+ let num = Number.parseInt(this.value);
|
|
|
+ if(num.toString() == "NaN") num = 0;
|
|
|
+ this.value = num;
|
|
|
+ });
|
|
|
+ $("form>input[type='submit']").click(function()
|
|
|
+ {
|
|
|
+ let counts = $("form>div#Store>div.goods>div#exp>div#count>input");
|
|
|
+ for (let index = 0; index < counts.length; index++) {
|
|
|
+ let num = Number.parseInt( counts[index].value);
|
|
|
+ if(num.toString() == "NaN") num = 0;
|
|
|
+ counts[index].value = num;
|
|
|
+ }
|
|
|
+ });
|
|
|
</script>
|
|
|
</body>
|
|
|
</html>
|
