Question

先生，我有10个文本框。前两个从用户获取值并在单击时在第三个文本框上显示乘法结果。第4个和第5个文本框也会获取值，并在单击时在第6个文本框中显示乘法结果。与上述相同，第7和第8个文本框将相应地工作，第9个文本框将在单击时显示乘法结果。第10个文本框采用第3个第6个和第9个文本框中的值并添加它们。

我可以进行乘法并在第10个文本框中显示总和。现在第6和第9个文本框可能存在也可能不存在，那么代码不会在html和javascript中运行。

请帮帮我......我附上了代码......

我的代码

<html>
<script >
function getext3(){
txt1 = document.getElementById("text1").value;
txt2 = document.getElementById("text2").value;
document.getElementById("text3").value = parseInt(txt1)*parseInt(txt2);

} 

function getext6(){
txt1 = document.getElementById("text4").value;
txt2 = document.getElementById("text5").value;
document.getElementById("text6").value = parseInt(txt1)*parseInt(txt2);

} 

function getext9(){
txt1 = document.getElementById("text7").value;
txt2 = document.getElementById("text8").value;
document.getElementById("text9").value = parseInt(txt1)*parseInt(txt2);

} 


function getext10(){
if(document.getElementById("text3").value != null && document.getElementById("text6").value == null && document.getElementById("text9").value == null) 
{
txt1 = document.getElementById("text3").value;
document.getElementById("text10").value = txt1; 
}
else if (document.getElementById("text3").value != null && document.getElementById("text6").value != null && document.getElementById("text9").value == null)
{
txt1 = document.getElementById("text3").value;
txt2 = document.getElementById("text6").value;
txt4 = parseInt(txt1)+parseInt(txt2);
document.getElementById("text10").value = txt4; 
}
else(document.getElementById("text3").value != null && document.getElementById("text6").value != null && document.getElementById("text9").value != null)
{
txt1 = document.getElementById("text3").value;
txt2 = document.getElementById("text6").value;
txt3 = document.getElementById("text9").value;
txt4 = parseInt(txt1)+parseInt(txt2)+parseInt(txt3);
document.getElementById("text10").value = txt4; 
}
} 
</script>

Text1 : <input type="text"value="0" id="text1" value=""> <br/>
Text2 : <input type="text" value="0"id="text2" value=""> <br/>
Text3 : <input type="text"value="0"id="text3" value="0" onclick="getext3()"> <br/>


Text4 : <input type="text"value="0"id="text4" value=""> <br/>
Text5 : <input type="text" value="0"id="text5" value=""> <br/>
<!--Text6 : <input type="text" id="text6" value="0" onclick="getext6()"> <br/>-->


Text7 : <input type="text"value="0"id="text7" value=""> <br/>
Text8 : <input type="text" value="0"id="text8" value=""> <br/>
<!--Text9 : <input type="text" id="text9" value="0" onclick="getext9()"> <br/>-->

Text10 : <input type="text" id="text10" value="" onclick="getext10()"> <br/>
</html>

Answer 1

更新代码

<html>
<script >
function getext3(){
txt1 = document.getElementById("text1").value;
txt2 = document.getElementById("text2").value;
document.getElementById("text3").value = parseInt(txt1)*parseInt(txt2);

} 

function getext6(){
txt1 = document.getElementById("text4").value;
txt2 = document.getElementById("text5").value;
document.getElementById("text6").value = parseInt(txt1)*parseInt(txt2);

} 

function getext9(){
txt1 = document.getElementById("text7").value;
txt2 = document.getElementById("text8").value;
document.getElementById("text9").value = parseInt(txt1)*parseInt(txt2);

} 


function getext10(){
     if(document.getElementById("text6").value==null){
    getext6();
    getext9();
    }

    if(document.getElementById("text4").value ==undefined)
   txt1 = document.getElementById("text4").value;
txt2 = document.getElementById("text5").value;
document.getElementById("text6").value = parseInt(txt1)*parseInt(txt2);
    txt1 = document.getElementById("text7").value;
txt2 = document.getElementById("text8").value;
document.getElementById("text9").value = parseInt(txt1)*parseInt(txt2);

if(document.getElementById("text3").value != null && document.getElementById("text6").value == null && document.getElementById("text9").value == null) 
{
txt1 = document.getElementById("text3").value;
document.getElementById("text10").value = txt1; 
}
else if (document.getElementById("text3").value != null && document.getElementById("text6").value != null && document.getElementById("text9").value == null)
{
txt1 = document.getElementById("text3").value;
txt2 = document.getElementById("text6").value;
txt4 = parseInt(txt1)+parseInt(txt2);
document.getElementById("text10").value = txt4; 
}
else(document.getElementById("text3").value != null && document.getElementById("text6").value != null && document.getElementById("text9").value != null)
{
txt1 = document.getElementById("text3").value;
txt2 = document.getElementById("text6").value;
txt3 = document.getElementById("text9").value;
txt4 = parseInt(txt1)+parseInt(txt2)+parseInt(txt3);
document.getElementById("text10").value = txt4; 
}
} 
</script>

Text1 : <input type="text"value="0" id="text1" value=""> <br/>
Text2 : <input type="text" value="0"id="text2" value=""> <br/>
Text3 : <input type="text"value="0"id="text3" value="0" onclick="getext3()"> <br/>


Text4 : <input type="text"value="0"id="text4" value=""> <br/>
Text5 : <input type="text" value="0"id="text5" value=""> <br/>
<!--Text6 : <input type="text" id="text6" value="0" onclick="getext6()"> <br/>-->


Text7 : <input type="text"value="0"id="text7" value=""> <br/>
Text8 : <input type="text" value="0"id="text8" value=""> <br/>
<!--Text9 : <input type="text" id="text9" value="0" onclick="getext9()"> <br/>-->

Text10 : <input type="text" id="text10" value="" onclick="getext10()"> <br/>
</html>

Demo

Answer 2

Never define multiple method from same functionality，

仅定义两种方法，一种用于multiplication，另一种用于sum。

EG： -

function multiply(element,id1, id2) {
    txt1 = document.getElementById(id1);
    txt2 = document.getElementById(id2);
        element.value =(txt1 ? parseInt(txt1.value) : 1) * (txt2 ? parseInt(txt2.value) : 1);
}

function sum(element,id1, id2, id3) {
    txt1 = document.getElementById(id1);
    txt2 = document.getElementById(id2);
    txt3 = document.getElementById(id3);
    element.value =(txt1 ? parseInt(txt1.value) : 0) + (txt2 ? parseInt(txt2.value) : 0)+ (txt3 ? parseInt(txt3.value) : 0);
}

并称他们为 -

onclick="multiply(this,'id_of_element_1','id_of_element_2')"

多个文本框添加条件

2 个答案:

Demo

DEMO