实时javascript计算

Question

我正在尝试根据表单字段的输入配置一个活动的caluator。我的问题是，我根本不知道我会如何在网站上显示结果。

<label class="contactform-label" for="contactform-member"><span class="contact_form_span">Member*:</span> </label>
<input class="contactform-input" type="text" id="contactform-member" placeholder="Member" name="member" value="" />
<span id="member-kosten">
    <script type="text/javascript">document.write(ausgabe)</script>
</span>



var price = 90;
var member = document.getElementById("contactform-member").value;
var calculate = Math.sqrt(price * member);
var ausgabe = (calculate);

Answer 1

使用以下代码：

​

function fun(){
var price = 90;
var member = document.getElementById("contactform-member").value;
var calculate = Math.sqrt(price * member);
var ausgabe = (calculate);
document.getElementById("member-kosten").innerHTML = ausgabe;
  }

<label class="contactform-label" for="contactform-member"><span class="contact_form_span">Member*:</span> </label>
<input class="contactform-input" type="text" id="contactform-member" placeholder="Member" name="member" value="" onkeyup="fun()" />
<span id="member-kosten">
    
</span>

​

Answer 2

从脚本(最后一行)设置元素member-kosten的html：

​

var price = 90;
var member = document.getElementById("contactform-member").value;
var calculate = Math.sqrt(price * member);
document.getElementById("member-kosten").innerHTML = calculate;

<label class="contactform-label" for="contactform-member"><span class="contact_form_span">Member*:</span> </label>
<input value="10" class="contactform-input" type="text" id="contactform-member" placeholder="Member" name="member" value="" />
<span id="member-kosten">
</span>

​