EDITED
谢谢大家谁提供支持......最好的工作剧本我会与你,希望我能帮助别人谁是寻找相同的解决方案分享:
$(document).ready(function(){
$("#price1, #price2").keyup(function() {
var priceOne = parseFloat($("#price1").val());
var priceTwo = parseFloat($("#price2").val());
var rate = parseFloat($("#rate").val());
if ($("#price1").val() && $("#price2").val()){
$('#rate').val(((priceTwo - priceOne) / priceOne * 100).toFixed(2));
}
});
$("#rate").keyup(function() {
var priceOne = parseFloat($("#price1").val());
var rate = parseFloat($("#rate").val());
if ($("#rate").val() && $("#price1").val() && $("#price2").val()){
$('#price2').val(((priceOne * rate)/ 100 + priceOne).toFixed(2));
}
});
})
您还可以测试它跟随这LINK
最初的问题:
请帮忙计算两个数字之间的百分比。 我想一个办法,但都没有成功。 请告诉我什么是错的,否则我将不胜感激,如果你能推荐其他脚本,它可以帮助我
我的脚本:
<html>
<head>
<script type="text/javascript">
$("#rate").text(function() {
var result = (parseInt(($("#price1").text(), 10) * 100)/ parseInt($("#price2").text(), 10));
if (!isFinite(result)) result = 0;
return result;
});?
</script>
</head>
<body>
<div id="price1"><label><input id="price1" type="text"></label></div>
<div id="price2"><label><input id="price2" type="text"></label></div>
<div id="rate"><label><input id="rate" type="text"></label></div>
</body>
</html>
使用val()
而不是text()
为input元素,使用$(function(){})
等待DOM已准备就绪。 也不要使用同一个ID元素。
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript">
$(function() {
$("#price1, #price2").change(function() { // input on change
var result = parseFloat(parseInt($("#price1").val(), 10) * 100)/ parseInt($("#price2").val(), 10);
$('#rate').val(result||''); //shows value in "#rate"
})
});
</script>
</head>
<body>
<div id="price-div1"><label>price1</label><input id="price1" type="text"></div>
<div id="price-div2"><label>price2</label><input id="price2" type="text"></div>
<div id="rate-div"><label>rate</label><input id="rate" type="text">%</div>
</body>
</html>
你有几个问题,
- ? 关闭文本功能的括号后面。
- 重复ID价格1和price2两个DIV和文本框
- 如果从文本框输入想要那么你应该使用VAL(),而不是文本()
修正你的代码
现场演示
HTML
<div id="dprice1"><label><input id="price1" type="text" value="80" /></label></div>
<div id="dprice2"><label><input id="price2" type="text" value="100" /></label></div>
<div id="drate"><label><input id="rate" type="text"></label></div>
<input id="btnCal" type="button" value="Calculate">
使用Javascript
$("#btnCal").click(function() {
$("#rate").val(function() {
var result = parseInt($("#price1").val()) * 100 / parseInt($("#price2").val());
if (!isFinite(result)) result = 0;
return result;
});
});
检查这个小提琴
http://jsfiddle.net/j3WY3/5/
已经取得了一些更正:
- 去掉
?
因为大家都说。 - 改变
.text()
到.val()
- 这两个
div
和input
了相同的ID
使用这样的,
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>
<script type="text/javascript">
$("#rate").text(function() {
var result = (parseFloat(($("#price1").val(), 10) * 100)/ parseFloat($("#price2").val(), 10));
if (!isFinite(result)) result = 0;
return result;
});
</script>
<body>
<div class="price1"><label><input id="price1" type="text"></label></div>
<div class="price2"><label><input id="price2" type="text"></label></div>
<div class="rate"><label><input id="rate" type="text"></label></div>
</body>
</html>
改变DIV级,并获得由输入值val()
可能是你想使用parseFloat()代替parseInt函数()
<div id="price-div1"></label>price1<label><input id="price1" type="text"></div>
<div id="price-div2"></label>price2<label><input id="price2" type="text"></div>
<div id="rate-div"><label>rate</label><input id="rate" type="text">%</div>
<script type="text/javascript">
$(function() {
$("#price1, #price2").change(function() {
var result = parseFloat(parseFloat($("#price1").val(), 10) * 100)/ parseFloat($("#price2").val(), 10);
$('#rate').val(result||'');
})
});
</script>