Question

我正在尝试从输入字段中获取不同的值，将它们分开并显示如下结果：

<input type="text" class="ad-title calculate form-control" name="budget" id="budget" value="" placeholder="Enter a daily budget in USD">

<input type="text" class="form-control calculate" id="ppc" name="ppc" value="" placeholder="">

我简单的jQuery：

$(document).ready(function() {    
    $(".calculate").bind("keyup change", function(e) {
         var budget = parseFloat($("#budget").val());
         var ppc = parseFloat($("#ppc").val());
         var value = ppc / budget;
        $("#sum").text(value);
    });
});

但是，在我的#sum div中，我看到的只有：NaN

我做错了什么？

Answer 1

你可以这样：

$(document).ready(function() {    
    $(".calculate").bind("keyup change", function(e) {
        var budget = parseFloat($("#budget").val()) || 0;
        var ppc = parseFloat($("#ppc").val()) || 0;

        var value = ppc / budget;

        if (!isNaN(value) && value !== Infinity) {
            $("#sum").text(value);
        }
    });
});

您可能需要根据自己的需要进行更改。例如，我们在除以零时得到NaN或非数字，所以处理它。也许你永远不想显示0，所以也许可以处理或预算为1。这取决于你希望它如何工作。

JSFiddle：http://jsfiddle.net/f0t45c7x/1

Answer 2

使用+ unary operator而不是使用parseFloat

将您的值转换为数字

＆＃13;

$(document).ready(function () {
    $(".calculate").bind("keyup change", function (e) {
        var budget = +$("#budget").val();
        var ppc = +$("#ppc").val();
        if(!budget || !ppc) return false; // Wait till both values are set
        var value = ppc / budget;
        $("#sum").text(value);
    });
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<input type="text" class="ad-title calculate form-control" name="budget" id="budget" value="" placeholder="Enter a daily budget in USD">
<input type="text" class="form-control calculate" id="ppc" name="ppc" value="" placeholder="">
<div id="sum"></div>

＆＃13;

Answer 3

更改此行：

var ppc = parseFloat($("#ppc").val());

到

var ppc = parseFloat($("#ppc").val()) || 0;

Answer 4

您不需要绑定“更改”事件，这应该做，

$(document).ready(function() {    
    $(".calculate").bind("keyup", function(e) {
        var budget = parseFloat($("#budget").val()) || 0;
        var ppc = parseFloat($("#ppc").val()) || 0;

        var value = (ppc / budget);
       // alert(value);
        if (!isNaN(value) && value != Infinity) {
            $("#sum").text(value);
        }
        else{
            $("#sum").text("0")
        }
    });
});

jQuery - 简单划分两个值

4 个答案: