Javascript 如何跟踪选择的案例并将值传递给函数
这是一个指向工作js的链接,其中 a) 用户选择一个类别,并相应地填充产品下拉列表 b) 根据产品显示瓦数。两者都使用switch语句Javascript 如何跟踪选择的案例并将值传递给函数,javascript,function,switch-statement,formula,Javascript,Function,Switch Statement,Formula,这是一个指向工作js的链接,其中 a) 用户选择一个类别,并相应地填充产品下拉列表 b) 根据产品显示瓦数。两者都使用switch语句 我正在努力学习如何做以下事情: 1) 跟踪productChange功能中的案例。页面上显示了哪个瓦数,以便我可以将该瓦数的数值传递给函数(每日能耗) 2) 我的最终目标是确保dailyEnergyConsumption函数获得进行计算所需的值。我想在点击4个按钮中的任何一个时显示它 我的尝试(方向/代码/一些伪代码)用JS注释。 我试图定义我需要的所有函数
我正在努力学习如何做以下事情: 1) 跟踪productChange功能中的案例。页面上显示了哪个瓦数,以便我可以将该瓦数的数值传递给函数(每日能耗) 2) 我的最终目标是确保dailyEnergyConsumption函数获得进行计算所需的值。我想在点击4个按钮中的任何一个时显示它 我的尝试(方向/代码/一些伪代码)用JS注释。 我试图定义我需要的所有函数 谢谢
var category = document.getElementById('ddl'),
product = document.getElementById('products'),
wattage = document.getElementById('wattage'),
refrigerators = new Array('Artic King AEB', 'Artic King ATMA', 'Avanti Compact', 'Bosch SS'),
dishWasher = new Array('Bosch - SHXUC', 'Asko DS', 'Blomberg', 'Amana');
var categoryChange = function() {
switch (category.value) {
case 'refrigerators':
products.options.length = 0;
for (i = 0; i < refrigerators.length; i++) {
createOption(products, refrigerators[i], refrigerators[i]);
}
break;
case 'dishWasher':
products.options.length = 0;
for (i = 0; i < dishWasher.length; i++) {
createOption(products, dishWasher[i], dishWasher[i]);
}
break;
default:
products.options.length = 0;
break;
}
productChange();
}
var productChange = function() {
switch (product.value) {
case 'Artic King AEB':
wattage.innerHTML = 400;
break;
case 'Artic King ATMA':
wattage.innerHTML = 500;
break;
case 'Avanti Compact':
wattage.innerHTML = 340;
break;
case 'Bosch SS':
wattage.innerHTML = 214;
break;
case 'Bosch - SHXUC':
wattage.innerHTML = 200;
break;
case 'Asko DS':
wattage.innerHTML = 187;
break;
case 'Blomberg':
wattage.innerHTML = 236;
break;
case 'Amana':
wattage.innerHTML = 150;
break;
default:
wattage.innerHTML = 'N/A'
break;
}
}
function createOption(ddl, text, value) {
var opt = document.createElement('option');
opt.value = value;
opt.text = text;
ddl.options.add(opt);
}
category.addEventListener('change', categoryChange);
product.addEventListener('change', productChange);
/* Attempt starts from below
function findWattage(){
// span on the page that displays wattage
var wattage = document.getElementById('wattage');
// created a new variable to find which case is selected.
var wattageOnPage = wattage.something that will track which case is selected.value;
// do i have to equate wattage with wattageOnPage
//
return wattageOnPage;
}
function estimatedDailyUse(dailyUse){
if(button.onclick.id =="h1"){
return dailyUse = 1;
}
else if (button.onclick.id =="h3"){
return dailyUse = 3;
}
else if (button.onclick.id =="h6"){
return dailyUse = 6;
}
else if (button.onclick.id =="h24"){
return dailyUse = 24;
}
}
dailyEnergyConsumption = function() {
// final display div
var daily = document.getElementById('daily');
//initialize the variable
var dailyEnergyConsumed = 0;
//Read the wattage that is displayed.
// Track the 4 buttons and gather which button is clicked and accordingly pass that to the formula
// so whenever I will need the selected wattage I can call it like this and get value into my formula
wattageOnPage = findWattage();
//Formula (1,500 W × 1) ÷ 1,000 = 1.5 kWh
var dailyEnergyConsumed = (wattageOnPage * dailyUse)/1000;
//Display and store 1.5 Kwh and pass it on to next function
return dailyEnergyConsumed;
daily.innerHTML = dailyEnergyConsumed;
}
/*
annualEnergyConsumption = function(annualEnergy) {
take the variable dailyEnergyConsumed and multiply that by no of days the user enters
1.5 kWh × 365 (days) = 547.5 kWh
Store it but do not display this
Pass it to annual Cost function
*/
/*
var annualEnergy=0;
var text = document.getElementById('hour').value;
var allYear = document.getElementById('allYear').value;
var annualEnergy = dailyEnergyConsumed * text;
return annualEnergy;
}
*/
/*
annualCost = function() {
var utilityRate = document.getElementById('utilityRate').value;
var button = document.getElementById('annualCost');
var annualCostOperation = document.getElementById('annualCostOperation');
var annualCost = ( annualEnergy * utilityRate);
take var annualEnergy (547.5) K wh from annualEnergyConsumption function
capture what the user enters in Utility Rate textbox (11 cents per K Wh)
( Calculate 547.5 kWh × $0.11/kWh = $60.23/year)
Click on the button to disaplay it
}
*/
年度能源消耗和成本计算器
选择类别
选择一个类别
冰箱
洗碗机
选择产品
--------------------------
瓦数
选择类别和产品以查看其瓦数
估计每日使用量
每天1小时不多
平均每天3小时
每天6小时
每天24小时始终开启
日能耗
0.268千瓦时
每年使用的大约天数
整年
年能耗
547.5千瓦时
输入每千瓦/小时的用电率
年运营成本
请阅读thanks@Ortomala. 我正在读这个。(我最近自学成才,这并不奇怪。)。