Javascript 根据所选选项执行算术运算

我有两个输入字段val_1和val_2，并选择选项。应用程序需要根据所选选项计算输入结果

函数calOparan（b）{
var sel_opera=b.options[b.selectedIndex].value；
if（sel_opera==“加法”）{
var sel_opera=“+”；
}
如果（sel_opera==“减法”）{
var sel_opera=“-”；
}
如果（sel_opera==“复制”）{
var sel_opera=“*”；
}
if（sel_opera==“Division”）{
var sel_opera=“/”；
}
//document.getElementById（“total_val”）.innerHTML=sel_opera；
返回塞卢歌剧院；
}
函数calculateNow（）{
var opr=calopran（）；
var val_1=document.getElementById（'val_1'）。值；
var val_2=document.getElementById（“val_2”）.value=（val_1-（val_1/100）*2）.toFixed（2）；
var结果=val_1+opr+val_2；
document.getElementById（'total_val'）.inner.HTML=result；
}

选择您的操作
附加
减法
复制
分部

这样它就不起作用了。不能将操作数作为字符串传递。这样做：

// compute the result according to the chosen option and return it
function compute(option, val1, val2){
    if(option == "Addition"){
        return val1 + val2;
    }
    if(option == "Subtraction"){
        return val1 - val2;
    }
    if(option == "Mutiplication"){
        return val1 * val2;
    }
    if(option  == "Division"){
        return val1 / val2;
    }
}

function calculateNow(){
    var val_1 = document.getElementById('val_1').value;
    var val_2 = document.getElementById("val_2").value = (val_1 - (val_1/100)*2).toFixed(2);
    var option = b.options[b.selectedIndex].value;

    // have the result computed inside the function
    var result = compute(option, val_1, val_2);
    document.getElementById('total_val').inner.HTML= result;
}

---

如您所见，代码现在更具可读性和简洁性。

您可以使用eval。此外，我建议您避免使用内联事件处理程序，最好使用输入事件

您可以尝试以下方法：

函数calOparan（b）{
var sel=document.getElementById（'selectOperation'）；
var sel_opera=sel.options[sel.selectedIndex].value；
if（sel_opera==“加法”）{
var sel_opera=“+”；
}
如果（sel_opera==“减法”）{
var sel_opera=“-”；
}
如果（sel_opera==“复制”）{
var sel_opera=“*”；
}
if（sel_opera==“Division”）{
var sel_opera=“/”；
}
//document.getElementById（“total_val”）.innerHTML=sel_opera；
//返回塞卢歌剧院；
calculateNow（塞卢歌剧院）；
}
函数calculateNow（sel_opera）{
var opr=sel_opera；//calopran（document.querySelector（'selectOperation'）；
var input1=document.getElementById（'val_1'）。值；
var val_1=input1==“”？0:input1；
var input2=document.getElementById（'val_2'）；
var val_2=input2.value==“”？0:input2.value；
val_2=document.getElementById（“val_2”）.value=（val_1-（val_1/100）*2）.toFixed（2）；
var结果=评估（val_1+opr+val_2）；
document.getElementById（'total_val'）。innerHTML=result；
}
document.getElementById（'val_1'）。addEventListener（'input'，Calopran）；
document.getElementById（'val_2'）。addEventListener（'input'，calOparan）；
document.getElementById（'selectOperation'）。addEventListener（'input'，Calopran）

选择您的操作
附加
减法
复制
分部
一个选项可能是将函数分配给与选择框中的值匹配的对象键，然后将两个参数传递给函数，类似于：


const select_ele=document.getElementById（'selectOperation'）；
const val_1_ele=document.getElementById（'val_1'）；
const val_2_ele=document.getElementById（'val_2'）；
const total_ele=document.getElementById（'total_val'）；
常量操作\u fns={
加法：（a，b）=>a+b，
减法：（a，b）=>a-b，
复制：（a，b）=>a*b，
分部：（a，b）=>a/b，
};
const update_total=（）=>{
常量操作=选择元素选项[选择元素选择索引]。值；
常数val_1=val_1元素值；
常数val_2=val_2_ele.value=（val_1-（val_1/100）*2）.toFixed（2）；
const result=操作[operation]？（+val_1，+val_2）；
total_ele.innerHTML=结果；
};
常量创建元素=（标记，属性）=>
Object.assign（document.createElement（标记），attrs）；
常量设置=（）=>{
对象。键（操作）。forEach(
（键）=>选择元素附加(
创建元素（'option'，{value:key，innerHTML:key}）
)
);
[选择元素、值1元素、值2元素].forEach(
（ele）=>ele.addEventListener（'input'，update_total）
);
};
设置（）

选择您的操作
您能解释一下val_2应该做什么吗？代码中的计算似乎忽略了其中的值。这段代码也令人惊讶，因为它还以一种更动态的方式解决了问题。感谢您的贡献，我希望向您了解更多。完美的代码Lynx242，感谢您的支持，它工作得非常好。