带有输入值和选定选项的javascript计算器
我对javascript非常陌生,现在我正努力让这个计算器工作: 我想做的是,如果有人单击按钮,我想将输入值和所选选项的值输入到计算中带有输入值和选定选项的javascript计算器,javascript,input,selection,calculator,option,Javascript,Input,Selection,Calculator,Option,我对javascript非常陌生,现在我正努力让这个计算器工作: 我想做的是,如果有人单击按钮,我想将输入值和所选选项的值输入到计算中var angebotspreis=wortzahl*(0.15+ausgansprache+zielsprache+fachgebiet+schriftbild)。但出于某种原因,它不起作用 我的代码似乎没有获得所选的值 这是基本代码: <div id="rechner"> <p id="h1" style="font-size
var angebotspreis=wortzahl*(0.15+ausgansprache+zielsprache+fachgebiet+schriftbild)代码>。但出于某种原因,它不起作用
我的代码似乎没有获得所选的值
这是基本代码:
<div id="rechner">
<p id="h1" style="font-size: 200%; font-weight: bold; margin-top: 5px;">Angebotsrechner</p>
<table style="max-width:350px; float:left; margin-right: 20px; font-weight: bold; font-size: 21px; line-height: 0px;">
<tr>
<th style="text-align:left; font-weight: inherit;">Gewünschte </th>
<th><select name="Ausgangssprache" size="1" id="ausgangssprache"> <option value="1">Deutsch</option> <option value="2">Englisch</option> <option value="3" selected>Französisch</option> <option value="4">Spanisch</option> <option value="5">Italienisch</option> <option value="6">Arabisch</option></select></th>
</tr>
<tr>
<td style="padding-bottom: 15px;">Sprachkombination</td>
<td style="padding-bottom: 15px;"><select name="Zielsprache" size="1" id="zielsprache"> <option selected value="1">Deutsch</option> <option value="2">Französisch</option> </select></td>
</tr>
<tr>
<td style="padding-bottom: 15px;">Fachgebiet</td>
<td style="padding-bottom: 15px;"><select name="Fachgebiet" size="1" id="fachgebiet"> <option value="1">Allgemein</option> <option value="2">Medizin</option> <option value="3" selected>Recht</option> <option value="4">Technik</option> <option value="5">Marketing</option></select></td>
</tr>
<tr>
<td style="padding-bottom: 15px;">Schriftbild</td>
<td style="padding-bottom: 15px;"><select name="schriftbild" size="1" id="schriftbild"> <option value="1" selected>Handschriftlich</option> <option value="0">Computer-Text</option> </select></td>
</tr>
<tr>
<td style="padding-bottom: 15px;">Wortzahl: </td>
<td style="padding-bottom: 15px;"><input type="text" id="wortzahl" placeholder=" z. B. 1673" style="width:165px; font-size: 20px;"></td>
</tr>
<tr>
<td></td>
<td><input class="button" id="button" type="button" value="Angebot berechnen" onClick="ausgeben()"></td>
</tr>
</table>
<p id="fehler"></p>
<p id="rechnerergebnis"></p>
<center><button id="angebot" class="button" onclick="showhide()"><a href="externe-sichere-seite??">↪ Angebot anfordern</a></button></center>
</div>
它不工作是什么意思?你有错误吗?如果是,什么错误?对于初学者来说,ausgeben
函数中的For循环需要有参数。我已经重新格式化了你的js,但是请1)按照@Tom指示更正错误,2)用===替换你的==你在ausgeben
中有一个空的For循环For()
// "Enter" in Input "wortzahl" = Button-click
document.getElementById( "wortzahl" )
.addEventListener( "keyup", function ( event ) {
event.preventDefault();
if ( event.keyCode == 13 ) {
document.getElementById( "button" ).click();
}
} );
//Function Button-click
function ausgeben() {
var test = document.getElementById( "wortzahl" );
var error = false;
var fehler = document.getElementById( "fehler" );
for ( ) {
if ( test.value == "" ) {
test.style.borderColor = "red";
error = true;
}
}
if ( !error ) {
var a = document.getElementById( "ausgangssprache" );
var ausgangssprache = a.options[a.selectedIndex].value;
var b = document.getElementById( "zielsprache" );
var zielsprache = b.options[b.selectedIndex].value;
var c = document.getElementById( "fachgebiet" );
var fachgebiet = c.options[c.selectedIndex].value;
var d = document.getElementById( "schriftbild" );
var schriftbild = d.options[d.selectedIndex].value;
var wortzahl = parseInt( document.getElementById( "wortzahl" ).value );
var angebotspreis = wortzahl * (0.15 + ausgangssprache + zielsprache + fachgebiet + schriftbild);
fehler.innerHTML = "";
document.getElementById( "rechnerergebnis" ).innerHTML = angebotspreis + " €";
// creates a button
document.getElementById( "angebot" ).style.display = "block";
}
else {
fehler.innerHTML = "Ihre Angaben sind unvollständig. Bitte geben Sie die Wortanzahl ein!";
document.getElementById( "angebot" ).style.display = "none";
}
}