如何比较其他条件下的值
如何比较其他条件下的值
提问于 2022-02-22 21:11:59
我有一个脚本，如果你点击一个苹果，葡萄或香蕉，它会提醒你的价格，税收从你选择的州。但是，出于某种原因，我一直在获得NaN。当我添加从数字中获得百分比的脚本时，NaN就开始出现了。
var apple = 2
var bananna = 3
var grapes = 4
var NJ = 6.625
var NY = 8.225
var PA = 6
var FL = 8
var e = document.getElementById("state").value
var oi;
if (e == NJ) {
oi = NJ
} else if (e == NY) {
oi == NY
} else if (e == PA) {
oi == PA
} else {
oi == FL
}
function myFunction() {
var percent = (oi / 100) * grapes;
alert(percent)
}
function yFunction() {
var percent = (oi / 100) * apple;
alert(percent)
}
function mFunction() {
var percent = (oi / 100) * bananna;
alert(percent)
}<h2>Enter state of residence.</h2>
<select name="state" class="state" id="state">
<option value="NJ">NJ</option>
<option value="NY">NY</option>
<option value="PA">PA</option>
<option value="FL">FL</option>
</select>
<h2> Click on what you wish to buy.</h2>
<button type="button" id="i"> <img src="https://www.applesfromny.com/wp-content/uploads/2020/05/Jonagold_NYAS-Apples2.png" onclick = "yFunction()" height ="80" width="100" /></button>
<button type="button" id="o"> <img src="https://th-thumbnailer.cdn-si-edu.com/xK6NAJHiv_51fzn5sDiQt0eD5Is=/fit-in/1600x0/https://tf-cmsv2-smithsonianmag-media.s3.amazonaws.com/filer/d5/24/d5243019-e0fc-4b3c-8cdb-48e22f38bff2/istock-183380744.jpg" onclick = "mFunction()" height ="80" width="100" /></button>
<button type="button" id="h"> <img src="https://www.meijer.com/content/dam/meijer/product/0000/00/0004/02/0000000004022_2_A1C1_1200.png" onclick = "myFunction()" height ="80" width="100" /></button><br>
回答 2
Stack Overflow用户
回答已采纳
发布于 2022-02-22 21:17:18
在比较值时，oi = NJ
- 使用Strings而不是变量名，在执行
oi = NY等操作时使用赋值运算符，就像您对做的那样
if (e == NJ) { // should be a String: "NJ"
oi = NJ // (this one is correct)
} else if (e == NY) { // should be a String: "NY"
oi == NY // should use assignment operator = not ==
// etc...beforehand.
- Don't
- 您应该在单击时获得Select值，而不是使用内联
on*属性。JS应该只位于一个位置，这是它各自的标记或文件。使用instead. - Don't
Element.addEventListener()复制/粘贴函数。这不是编程的意义。相反，要检测相似之处，并将数据创建为对象。 - 使用按钮上的HTML
data-*属性来定义项目标属性。使用JS的Element.dataset来检索存储的值.
重拟建议：
const oi = {
NJ: 6.625,
NY: 8.225,
PA: 6,
FL: 8
};
const prices = {
apple: 2,
banana: 3,
grape: 4
};
const calc = (item) => {
const state = document.querySelector("#state").value;
const result = oi[state] / 100 * prices[item];
alert(result);
};
document.querySelectorAll("[data-item]").forEach(el => {
el.addEventListener("click", () => calc(el.dataset.item));
});<select id="state">
<option value="NJ">NJ</option>
<option value="NY">NY</option>
<option value="PA">PA</option>
<option value="FL">FL</option>
</select>
<h2> Click on what you wish to buy.</h2>
<button type="button" data-item="apple">apple</button>
<button type="button" data-item="banana">banana</button>
<button type="button" data-item="grape">grape</button>
免责声明:我不知道你到底在计算什么，但给你。
Stack Overflow用户
发布于 2022-02-22 22:50:46
状态值从不会在代码中设置，因此也不会设置oi。这是修改过的代码。您的代码可以优化/简化。例如，您不需要三个函数来计算价格(顺便说一下，您的计算是不正确的；它只计算了税收)。
var apple = 2
var bananna = 3
var grapes = 4
var NJ = 6.625
var NY = 8.225
var PA = 6
var FL = 8
// var e = document.getElementById("state").value
var e = ''
var oi = NJ // initial state
function state(o)
{
if(o.value == 'NJ') {
oi = NJ
} else if(o.value == 'NY') {
oi = NY
} else if(o.value == 'PA') {
oi = PA
} else {
oi = FL
}
}
function myFunction() {
var percent = (oi / 100) * grapes;
alert(percent);
}
function yFunction() {
var percent = (oi / 100) * apple;
alert(percent)
}
function mFunction() {
var percent = (oi / 100) * bananna;
alert(percent)
}
<h2>Enter state of residence.</h2>
<select name="state" class="state" id="state" onChange="state(this);">
<option value="NJ">NJ</option>
<option value="NY">NY</option>
<option value="PA">PA</option>
<option value="FL">FL</option>
</select>
<h2> Click on what you wish to buy.</h2>
<button type="button" id="i"> <img src="https://www.applesfromny.com/wp-content/uploads/2020/05/Jonagold_NYAS-Apples2.png" onclick = "yFunction()" height ="80" width="100" /></button>
<button type="button" id="o"> <img src="https://th-thumbnailer.cdn-si-edu.com/xK6NAJHiv_51fzn5sDiQt0eD5Is=/fit-in/1600x0/https://tf-cmsv2-smithsonianmag-media.s3.amazonaws.com/filer/d5/24/d5243019-e0fc-4b3c-8cdb-48e22f38bff2/istock-183380744.jpg" onclick = "mFunction()" height ="80" width="100" /></button>
<button type="button" id="h"> <img src="https://www.meijer.com/content/dam/meijer/product/0000/00/0004/02/0000000004022_2_A1C1_1200.png" onclick = "myFunction()" height ="80" width="100" /></button><br>页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/71228354
复制相关文章
相似问题
腾讯云开发者
