Question

当我键入0到1.53之间的数字时，我首先有两个输入，我想自动将其替换为1.53，当我键入1.54时，我想将其替换为3.06，因为（1.53 + 1.53）= 3.06等。我使用数学运算.ceil（），但我不知道如何将此值输入？

更多解释：

<p>if first input range between 0 - 1.53 result first input = 1.53, second input = 1</p>
<p>if first input range between 1.54 - 3.06 result first input = 3.06, second input = 2</p>
<p>if first input range between 3.06 - 4.59 result first input = 4.59, second input = 3</p>
    <div class="input-box col-sm-12">
        <label>in this input result supposed to round up to next multiple like 1.53 and 3.06 and 4.59...</label><br/>
        <input type="text" value="" id="product_val" autocomplete="off">
    </div>
    <div class="input-box col-sm-12">
        <label>second input</label><br/>
        <input type="number" value="" id="products_packs" autocomplete="off" disabled>
    </div>

和js：

$(document).ready(function() {
var packSize = 1.53,
    packPrice = 35;
$('#product_val').keyup(function() {
    var area2 = $(this).val().replace(',', '.');
        var area = (Math.ceil(area2 / packSize) * packSize);
    var packs = Math.ceil(area / packSize);
    setPrice(packs * packPrice); 
    setPacks(Math.ceil(area / packSize)); 
});
$('#products_packs').keyup(function() {
    var packs = $(this).val();
    setPrice(packPrice * packs); 
    setArea(packSize * packs); 
    setPacks(packs);
});
function setArea(value) {
    $("#product_val").val(value);
}
function setPacks(value) {
    $("#products_packs").val(value);
    $("#quantity_wanted").val(value);
}
function setPrice(value) {
    $("#products_price").text($("#products_price").text().replace(/[0-9\.\,]+/, parseFloat(value).toFixed(2)));
}
});

该行可以完成所有工作，但是我需要在停止输入var area = (Math.ceil(area2 / packSize) * packSize);后如何用该行的结果替换第一个输入中输入的值？

这里正在摆弄小提琴https://jsfiddle.net/wzte04rj/1/

Answer 1

看看updated fiddle，它会按您期望的那样工作。

说明：

问题是，您需要为您完成一些数学工作。我已经提出了这个：

( Math.floor( inputValue / packSize ) + 1 ) * packSize;

但是由于它是一种简单的算法，因此还有许多其他选择。唯一要指出的是，在输入 1.53 的情况下，该行的行长为 3.06 ；因此，如果值return已可除掉，我们需要在if语句之前取消计算（写一个packSize表达式）。喜欢：

var divider = inputValue / packSize;

if ( divider == ~~divder )
    return;

( Math.floor( inputValue / packSize ) + 1 ) * packSize;

另一点是，当用户离开输入时，我们正在更新值。用户在输入时更改输入的值并不是很好的体验。但是您可以将此 event 更改为所需的任何内容。

玩得开心<3

Answer 2

this version of question的答案：

我在area, packs中更改了setPacks和$('#product_val').keyup-这是jsfiddle：

$('#product_val').keyup(function() {
    var area2 = $(this).val().replace(',', '.');
    var area = Math.ceil(area2 / packSize);
    var packs = Math.ceil(area );
    setPrice(packs * packPrice); 
    setPacks(packSize * area); 
});

输入四舍五入/替换为键盘上的下一个倍数

2 个答案: