尝试从文本框中获取两个输入值,单击一个按钮,然后以文本形式返回答案
两个输入名称是“weight”和“reps”。我想要它,所以一旦你点击按钮,它就会进行计算并添加到 div“result”
HTML:
<div>
Weight lifted: <input name="weight" type="text" value="?">
</div>
<div>
Reps attained: <input name="reps" type="text" value="?">
</div>
<button>Calculate One-Rep Max</button>
<div id="result"></div>
我现在拥有的 jquery:
$(document).ready(function() {
$('button').click(function() {
var weight = $('input[name=weight]').val();
var reps = $('input[name=weight]').val();
var max = $('input[name=weight]').val() * $('input[name=reps]').val() * 0.0333 + $('input[name=weight]').val();
$('#result').append("<p>" + max + "</p>");
});
});
最佳答案
问题是 .val()
返回一个字符串,而 *
运算符隐式地将字符串转换为数字(例如 "5.0"* "5.0 "
→ 25
),+
运算符不会。最后的 +
不是将两个数字相加,而是将它们连接成字符串(例如 "5.0"+ "5.0"
→ "5.05.0 "
)。您需要首先解析输入,然后将结果作为数字进行处理。
试试这个:
var weight = Number($('input[name=weight]').val());
var reps = Number($('input[name=reps]').val());
var max = weight * reps * 0.0333 + weight ;
$('#result').append("<p>" + max + "</p>");
// or $('<p>').text(max).appendTo("#result");
关于javascript - 使用 jQuery 将两个输入值相乘并在页面上将答案显示为段落,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21174173/