2013-05-03 58 views
0

我写了一个简单的JavaScript函数,它可以让网站访问者看到一个公司要交付给那里的位置需要多少费用。它只是一个功能,让他们从下拉菜单中选择城市,然后显示价格。以下是我如何决定定义我想打印的变量。如何让此送货计算器更高效?

var delivery=document.getElementById("delivery").value; //id of selection box 

var deliveryCharge; 
if (delivery=="None") 
{ 
deliveryCharge=0; 
} 
else if (delivery=="Acworth") 
{ 
deliveryCharge=175; 
} 
else if (delivery=="Alpharetta") 
{ 
deliveryCharge=140; 
} 

然后我用...

document.getElementById("charge").innerHTML="$" + deliveryCharge.toFixed(2); 

显示量。问题是我需要在HTML输入和JavaScript中放置400个位置。我想知道的是,你们都将如何处理这个功能,是否有更有效的方法,以便我不必再编写400条if语句? (p.s)位置和价格之间没有数学关系。)

非常感谢大家的时间和回应。

+0

http://codereview.stackexchange.com/ – j08691 2013-05-03 16:47:21

+0

什么是您的网站上投放吗?如在后端是什么?有没有可以添加到此的数据库? – WheretheresaWill 2013-05-03 16:47:49

+0

你可以对数据库甚至是json文件收费,并且只匹配选定的ID,或者你可以使用带键的数组 – isJustMe 2013-05-03 16:49:03

回答

4

简单,使用对象:

var deliveryCharges = { 
    "None": 0, 
    "Alpharetta": 400, 
    "Test": 200 
}; 
function getDeliveryCharge(type) { 
    var currentType = type || "None"; // undefined and null out of the way. 
    if (typeof deliveryCharges[currentType] !== 'undefined') {// No error thrown here. 
     return deliveryCharges[currentType];// type recognized return it 
    } else { 
     return 0;// type not found, just return 0; 
    }; 
}; 

我们实际上得到它:

var delivery= getDeliveryCharge(document.getElementById("delivery").value); 
+0

因此,我知道如何制作地图和对象,但是如何使用这些来中继总计那匹配给用户? – 2013-05-03 16:52:43

+0

非常感谢您的回应。感谢您添加评论,总是有帮助的。 – 2013-05-03 16:56:43

2

浮现在脑海中首先想到的是地图,像这样:

var map = { 
    'None': 0, 
    'Acworth': 175, 
    ... 
}; 
0

除了object选项已经建议,我肯定会建议放弃这种方法,并争取更多的选择xible方法。城市和市镇是每年合并和创建的,所以保持你的收藏将会是地狱。我建议使用Ajax回调到服务器,在那里你可以调用Google Maps API来提供到交付位置的实际距离的猜测,然后应用一个简单的公式(如果需要的话,只有当它不在附近城市的一组预定成本)。

+0

谢谢你的回应,我认为这对未来来说是一个好主意,当我的技能发展的更好一点时。 – 2013-05-03 16:55:34

0

要添加到阿尔贝托的答案,也许也将交付地点划分成区域,然后将您的位置映射到这些区域?这样,当您的成本发生变化时,您可以同时更改整组交货价格。 (更改区域价格而不是同一区域内的37个单独价格。)

这可能在代码中效率较低,但对于可维护性而言效率更高。

(除非,当然,所有的400个地区真正具有独特的价格,然后就没有必要。)