计算输入之间的百分比，然后使用Jquery将背景颜色更改为结果百分比
计算输入之间的百分比，然后使用Jquery将背景颜色更改为结果百分比
提问于 2020-08-26 14:34:57
如何将input="rate“与input="days”相乘，并以input="client-price“显示结果。然后用input=“my-input=”计算客户价格的百分比，并在input="margin“中显示结果。然后更改"e“的颜色，如果边距百分比高于50%，则其div颜色背景变为红色，如果低于50%，则变为绿色？
这是我的表格：
$(".calc input").keyup(function() {
var rate = +$("#rate").val();
var days = +$("#days").val();
var client_price = rate * days;
client_price = Math.ceil(client_price);
$("#client-price").val(client_price);
});
$(".calc-two input").keyup(function() {
var client_price = +$("client-price").val();
var my_price = +$("#my-price").val();
var margin = (my_price * 100) / client_price;
margin = Math.ceil(margin);
$("#margin").val(margin);
}); <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="a calc"><label>Rate</label><input id="rate" name="rate" type="text"></div>
<div class="b calc"><label>Days</label><input id="day" name="day" type="text" ></div>
<div class="c calc-two">
<label>Client Price</label>
<input id="client-price" name="client-price" type="text">
</div>
<div class="d calc-two">
<label>My price</label>
<input id="my-price" name="my-price" type="text">
</div>
<div class="e"><label>Margin</label><input id="margin" name="margin" type="text" value=""></div>
回答 1
Stack Overflow用户
回答已采纳
发布于 2020-08-26 15:01:08
我只需添加一些部分并编辑错误，我将让您完成最终百分比的部分
$(".calc input").keyup(function() {
var rate = +$("#rate").val();
var days = +$("#days").val();
var client_price = rate * days;
client_price = Math.ceil(client_price);
$("#client-price").val(client_price);
});
$(".calc-two input").keyup(function() {
var client_price = +$("#client-price").val();
var my_price = +$("#my-price").val();
var margin = (my_price * 100) / client_price;
margin = Math.ceil(margin);
if(margin > 50){$('.e').css("background-color","red");}else{$('.e').css("background-color","green");}
$("#margin").val(margin);
});<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="a calc"><label>Rate</label><input id="rate" name="rate" type="text"></div>
<div class="b calc"><label>Days</label><input id="days" name="day" type="text" ></div>
<div class="c calc-two">
<label>Client Price</label>
<input id="client-price" name="client-price" type="text">
</div>
<div class="d calc-two">
<label>My price</label>
<input id="my-price" name="my-price" type="text">
</div>
<div class="e"><label>Margin</label><input id="margin" name="margin" type="text" value=""></div>
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/63591798
复制相关文章
相似问题
腾讯云开发者
