The shopping cart effect implemented by JavaScript can of course be used in many places, such as friend selection, human resources module, salary calculation, personnel selection, etc. Below is a rendering of something similar to a shopping cart:
code:
goodsCar.js: This js is written as a separate file. Mainly controls the list display above.
window.onload=function(){
initStore ();
};
var goods=["ham","beauty","royal sister","day trip to Mars","sports car"];
//===== ============= Think clearly about why you need to define a temporary storage area =============
var temps=[];//Temporary storage
//Initialize warehouse select and add content
function initStore(){
var select_store=document.getElementById("select_store");
for(var x=0;x{
//Create option object
var optionNode=document.createElement("option");
optionNode.innerHTML=goods[x];
select_store.appendChild(optionNode);
}
}
//---------------------------------------------
function selectGoods(){
//Get the select list object of the store
var out_store=document.getElementById("select_store");
//Get the select list object of my goods
var in_store=document.getElementById("select_my");
moveGoods(in_store,out_store);
}
function deleteGoods(){
//1. Record the products to be moved
var in_store=document.getElementById("select_store");
var out_store=document.getElementById("select_my");
moveGoods(in_store,out_store);
}
/*
* Move Goods:
1.inSotre: Move goods into the warehouse
2.outStore: Move goods out of the warehouse
*/
//Move
function moveGoods(inStore,outStore){
/ /================Clear the array cache==================
temps=[];
// Loop to get all list items in the store
for(var x=0;x{
var option=outStore.options[x];
// Add the selected list items to the temporary array for storage
if(option.selected){
temps.push(option);//Add data to the temporary array. In order to avoid duplication, the array cache must be cleared
}
}
//2. Delete the selected item in the store list
//3. Add the selected product to the shopping cart
for(var x=0;x< temps.length; Add
inStore.appendChild(temps[x]);
}
}
The following is the main file;
Copy code
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn