[英]Multiple Two Drop Down Boxes onclick without append
这是我对javascript的首次尝试,并先在这里发布。 我正在尝试显示两个下拉框中的值简单相乘的结果。 因此,用户从每个值中选择一个值,然后单击按钮并获得A * B。 我如何使用它是可行的,但是如果他们更改答案并尝试提交新的数字,则第二个结果将附加到第一个结果。 我一生无法重新设置该字段。 我尝试了.replaceWith(result)而不是.append(result),它解决了这个问题,但是用户根本无法做出第二个选择。
任何帮助,不胜感激! 另外,很想知道它是否可以用逗号作为千位分隔符输出。
<form name="myForm" id="myForm">
<label>Select Amount</label>
<select id="box1" type="select" oninput="calculate()" />
<option value="choose" selected>Choose</option>
<option value="15000">$15,000</option>
<option value="20000">$20,000</option>
<option value="25000">$25,000</option>
<option value="30000">$30,000</option>
<option value="35000">$35,000</option>
</select>
<label>Select Type</label>
<select id="box2" type="select" oninput="calculate()" />
<option value="x" selected>Choose</option>
<option value=".21">1</option>
<option value=".40">2</option>
</select>
<input class="button" type="submit" value="Submit" id="multiply">
<p>
<strong>here are the results:</strong>
</p>
<h3>
<strong>$<span id="result2"></span></strong> a week
</h3>
</form>
<script>
$(document).ready(function(){
$('#multiply').click(function(event){
event.preventDefault();
var n1=$('#box1').val();
var n2=$('#box2').val();
var result=Math.round(n1*n2 /52);
$('#resultholder2').fadeIn(200);
$('#number1').append(n1);
$('#number2').append(n2);
$('#result2').append(result);
});
});
</script>
你做的很棒。 仅在显示新结果之前隐藏先前的结果,然后使用html来显示结果。
<script>
$(document).ready(function(){
$('#multiply').click(function(event){
event.preventDefault();
var n1=$('#box1').val();
var n2=$('#box2').val();
var result=Math.round(n1*n2 /52);
$("#result2").hide();
$('#resultholder2').fadeIn(200);
$('#number1').append(n1);
$('#number2').append(n2);
$('#result2').html(result);
});
});
</script>
这是您的JavaScript代码。
`$(document).ready(function(){
$("select").change(function(){
var n1=$('#box1').val();
var n2=$('#box2').val();
var result=Math.round(n1*n2 /52);
if(!isNaN(result))
$("#result2").text(result);
});
});`
尝试这个:
$('#result2').text('');
在将值分配给result元素之前使用此语法。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.