Js implementation of a simple shopping cart has a diagram has code
- 2020-03-30 03:02:52
- OfStack
As shown in figure:
< img SRC = "border = 0 / / files.jb51.net/file_images/article/201405/201405260924131.gif? 201442692444 ">
The implementation of all selected buttons is:
The last span TAB is used to hold the area that shows the total amount.
The code to implement the two "select all" functions is:
Event.srcelement implements the retrieval of the response event button.
The for loop modifies the checked property for each checkbox.
The total amount is calculated by:
Adds the values of all selected check boxes.
< img SRC = "border = 0 / / files.jb51.net/file_images/article/201405/201405260924131.gif? 201442692444 ">
The implementation of all selected buttons is:
<input type="checkbox" name="all" onclick="checkAll()" /> Future generations <br />
<input type="checkbox" name="item" value="3000" /> Laptop: 3000 yuan <br />
<input type="checkbox" name="item" value="3000" /> Laptop: 3000 yuan <br />
<input type="checkbox" name="item" value="3000" /> Laptop: 3000 yuan <br />
<input type="checkbox" name="item" value="3000" /> Laptop: 3000 yuan <br />
<input type="checkbox" name="item" value="3000" /> Laptop: 3000 yuan <br />
<input type="checkbox" name="item" value="3000" /> Laptop: 3000 yuan <br />
<input type="checkbox" name="item" value="3000" /> Laptop: 3000 yuan <br />
<input type="checkbox" name="item" value="3000" /> Laptop: 3000 yuan <br />
<input type="checkbox" name="item" value="3000" /> Laptop: 3000 yuan <br />
<input type="checkbox" name="item" value="3000" /> Laptop: 3000 yuan <br />
<input type="checkbox" name="all" onclick="checkAll()" /> Future generations <br />
<input type="button" value=" Get the total amount " onclick="getSum()" />
<span id="sum"></span>
The last span TAB is used to hold the area that shows the total amount.
The code to implement the two "select all" functions is:
function checkAll()
{
//var allNode = document.getElementsByName("all")[0];
//Gets the clicked element
var allNode = event.srcElement;
var item = document.getElementsByName("item");
for(var x=0;x<item.length;x++)
{
item[x].checked = allNode.checked;
}
}
Event.srcelement implements the retrieval of the response event button.
The for loop modifies the checked property for each checkbox.
The total amount is calculated by:
function getSum()
{
var item = document.getElementsByName("item");
var sum = 0;
for(var x=0;x<item.length;x++)
{
if(item[x].checked)
{
sum+=parseInt(item[x].value);
}
}
var spanNode = document.getElementById("sum");
spanNode.innerHTML = (sum+" yuan ").fontsize(7);
}
Adds the values of all selected check boxes.